html, body {
    height: 100%;
    display: flex;
    flex-direction: column;
    overflow: auto !important;
  }
  
  .main {
    flex: 1 1 auto;
    overflow-y: auto; 
  }
  .btn.disabled, .btn[disabled], fieldset[disabled] .btn{
      background-color: lightgray !important;
      color: black;
      border: none;
  }
  .parsley-custom-error-message{
      display: block;
      font-weight: bold;
      font-size: large;
  }
  .twitter-typeahead {
        display: block;
        width: 100%;
  }
  .tt-menu {
    width: 422px;
    margin: 12px 0;
    padding: 8px 0;
    background-color: #fff;
    border: 1px solid #ccc;
    border: 1px solid rgba(0, 0, 0, 0.2);
    -webkit-border-radius: 8px;
       -moz-border-radius: 8px;
            border-radius: 8px;
    -webkit-box-shadow: 0 5px 10px rgba(0,0,0,.2);
       -moz-box-shadow: 0 5px 10px rgba(0,0,0,.2);
            box-shadow: 0 5px 10px rgba(0,0,0,.2);
  }
  .parsley-error{
      border:1px solid red !important;
  }
  .SummaryTable{
      width:inherit !important;
  }
  body {
      background-color: #EFEEEE;
      background-position: top center;
      background-repeat: no-repeat;
      font-size: 1.4em;
      padding: 0;
      margin: 0;
  }
  .loginBG {
    background-image: radial-gradient(at 61% 79%, hsla(226,85%,67%,1) 0px, transparent 50%), radial-gradient(at 49% 58%, hsla(138,100%,23%,0.61) 0px, transparent 50%), radial-gradient(at 37% 7%, hsla(156,76%,77%,1) 0px, transparent 50%), radial-gradient(at 9% 24%, hsla(154,86%,78%,1) 0px, transparent 50%), radial-gradient(at 9% 75%, hsla(268,65%,79%,1) 0px, transparent 50%), radial-gradient(at 61% 23%, hsla(232,49%,42%,1) 0px, transparent 50%), radial-gradient(at 38% 93%, hsla(295,71%,72%,1) 0px, transparent 50%);
    margin-left: 0;
  }
  .DataBG {
      background-image: radial-gradient(at 61% 79%, hsla(226,85%,67%,1) 0px, transparent 50%), radial-gradient(at 49% 58%, hsla(138,100%,23%,0.61) 0px, transparent 50%), radial-gradient(at 37% 7%, hsla(156,76%,77%,1) 0px, transparent 50%), radial-gradient(at 9% 24%, hsla(154,86%,78%,1) 0px, transparent 50%), radial-gradient(at 9% 75%, hsla(268,65%,79%,1) 0px, transparent 50%), radial-gradient(at 61% 23%, hsla(232,49%,42%,1) 0px, transparent 50%), radial-gradient(at 38% 93%, hsla(295,71%,72%,1) 0px, transparent 50%);
      background-color: #fff;
  }
  #LogoContainer {
      background: url('https://cdn-derbyacuk.terminalfour.net/media/derbyacuk/assets/uod-logo.png') no-repeat center;
      background-size: contain;
      width: 100%;
      height: 100px;
      margin-top: -130px !important;
      position: fixed;
      
      width: 25%;
      z-index: 1040;
      
  }
  #Logo {
      
      
      
      
      display: none;
  }
  #Logo:hover {
      
  }
  @media (max-width: 991px) {
      #LogoContainer {
          
          
          
          
          
          
      }
      #Logo {
          height: 80px;
          margin-right: -45px;
          transition: ease-in-out .5s;
          width: 202px;
      }
      #Logo:hover {
          margin-right: -80px;
          transition: ease-in-out .5s;
      }
  }
  @media (max-width: 767px) {
      #LogoContainer {
          
          
          height: 80px;
          
          
          
      }
      #Logo {
          height: 64px;
          margin-right: -45px;
          transition: ease-in-out .5s;
          width: 161px;
      }
      #Logo:hover {
          margin-right: -80px;
          transition: ease-in-out .5s;
      }
  }
  @media (max-width: 649px) {
      #LogoContainer {
          
          
          
          
          
          
      }
      #Logo {
          height: 46px;
          margin-right: -45px;
          transition: ease-in-out .5s;
          width: 116px;
      }
      #Logo:hover {
          margin-right: -80px;
          transition: ease-in-out .5s;
      }
  }
  @media (max-width: 400px) {
      #LogoContainer {
          
          
          
          
          
          
      }
      #Logo {
          height: 36px;
          margin-right: -45px;
          transition: ease-in-out .5s;
          width: 91px;
      }
      #Logo:hover {
          margin-right: -80px;
          transition: ease-in-out .5s;
      }
      #navbar {
          margin-top: -9px;
      }
  }
  .btn-default {
      background-color: black;
      
      border-color: #fff;
      border-radius: 3rem;
      
      color: white;
      font-size: 1.1em;
      font-weight: 400;
      max-width: 200px;
      min-width: 170px;
      padding-bottom: 15px;
      padding-left: 25px;
      padding-right: 25px;
      padding-top: 15px;
      
  }
  .btn-default:hover {
      background-color: white;
      
      
      border-radius: 3rem;
      
      color: black;
      font-size: 1.1em;
      font-weight: 400;
      max-width: 200px;
      min-width: 170px;
      padding-bottom: 15px;
      padding-left: 25px;
      padding-right: 25px;
      padding-top: 15px;
      
  }
  h1 {
      color: #111;
      font-family: 'Roboto Slab', serif;
      font-size: 32px;
      font-weight: 600;
  }
  h2 {
      color: #111;
      font-family: 'Roboto Slab', serif;
      font-size: 26px;
      font-weight: 600;
  }
  h3 {
      color: #111;
      font-family: 'Roboto Slab', serif;
      font-size: 20px;
      font-weight: 600;
  }
  .AccountIcon {
      margin-right: 7px;
      margin-top: 0px;
  }
  @media (min-width: 0px) {
      body {
          background-position: top center;
          background-size: 150% auto;
          padding-bottom: 0px;
      }
  }
  @media (min-width: 650px) {
      body {
          background-position: top center;
          background-size: 120% auto;
      }
  }
  @media (min-width: 767px) {
      body {
          background-position: top center;
          background-size: 120% auto;
      }
  }
  @media (min-width: 1700px) {
      body {
          background-position: top center;
          background-size: 100% auto;
      }
      h2 {
          font-family: 'Metrophobic', Arial, serif;
          font-size: 28px;
          font-weight: 700;
      }
  }
  @media (min-width: 2000px) {
      h2 {
          font-family: 'Metrophobic', Arial, serif;
          font-size: 28px;
          font-weight: 700;
      }
  }
  h1.Hero {
      color: #fff;
      font-family: 'Metrophobic', Arial, serif;
      font-size: 54px;
      font-weight: 700;
      text-shadow: 2px 2px 2px rgba(0, 0, 0, .85);
  }
  h2.Hero {
      color: #fff;
      font-family: 'Metrophobic', Arial, serif;
      font-size: 40px;
      font-weight: 700;
      text-shadow: 2px 2px 2px rgba(0, 0, 0, .85);
  }
  h3.Hero {
      color: #fff;
      font-family: 'Metrophobic', Arial, serif;
      font-size: 32px;
      font-weight: 200;
      margin-bottom: -20px;
      text-shadow: 2px 2px 2px rgba(0, 0, 0, .85);
  }
  .sub-header {
      border-bottom: 1px solid #eee;
      padding-bottom: 10px;
  }
  .navbar-fixed-top {
      border: 0;
  }
  .sidebar {
      display: none;
  }
  @media (min-width: 768px) {
      .sidebar {
          background-color: #f5f5f5;
          border-right: 1px solid #eee;
          bottom: 0;
          display: block;
          left: 0;
          overflow-x: hidden;
          overflow-y: auto;
          padding: 20px;
          position: fixed;
          top: 86px;
          z-index: 1000;
      }
  }
  .nav-sidebar {
      margin-bottom: 20px;
      margin-left: -20px;
      margin-right: -21px;
  }
  .nav-sidebar > li > a {
      padding-left: 20px;
      padding-right: 20px;
  }
  .nav-sidebar > .active > a,
  .nav-sidebar > .active > a:hover,
  .nav-sidebar > .active > a:focus {
      background-color: #428bca;
      color: #fff;
  }
  .main {
      padding: 20px;
      flex: 1;
  }
  @media (min-width: 768px) {
      .main {
          padding-left: 40px;
          padding-right: 40px;
      }
  }
  .main .page-header {
      margin-top: 0;
  }
  .placeholders {
      margin-bottom: 30px;
      text-align: center;
  }
  .placeholders h4 {
      margin-bottom: 0;
  }
  .placeholder {
      margin-bottom: 20px;
  }
  .placeholder img {
      border-radius: 50%;
      display: inline-block;
  }
  #LogoTab {
      background: #163565;
      float: left;
      height: 90px;
      margin-bottom: 10px;
      width: 222px;
  }
  #SearchTab {
      background: #488BA4;
      float: left;
      height: 90px;
      margin-bottom: 10px;
      width: 90px;
  }
  .navbar-fixed-top {
      border: 0;
      
      
  }
  .navbar-inverse {
      background-color: rgb(255 255 255 / 50%);
      
      backdrop-filter: blur(20px);
  }
  .AlignRight {
      margin-left: auto;
      margin-right: 0px;
  }
  .navbar {
      height: 80px;
  }
  .navbar-brand {
      float: left;
      height: 80px;
      padding-top: 15px;
  }
  #uodlogo {
      margin-top: 5px;
      width: 160px;
  }
  #uodfooter {
      margin-top: 5px;
      
      width: 160px;
  }
  .navbar-inverse .navbar-nav>li>a {
      background-color: none;
      color: #000;
      padding-top: 38px;
  }
  .navbar-inverse .navbar-nav>li>a:hover {
      
      color: var(--pt-palette-1);
      padding-top: 38px;
  }
  .navbar-inverse .navbar-nav>.active>a,
  .navbar-inverse .navbar-nav>.active>a:focus,
  .navbar-inverse .navbar-nav>.active>a:hover {
      background-color: rgba(255, 255, 255, 0);
      color: #000;
  }
  .navbar-nav>li>a {
      font-size: 14px;
      padding-bottom: 6px;
      padding-left: 15px;
      padding-top: 15px;
  }
  @media (max-width: 991px) {
      .navbar-nav>li>a {
          font-size: 11px;
          padding-bottom: 6px;
          padding-left: 7px;
          padding-top: 15px;
      }
  }
  @media (max-width: 767px) {
      .navbar-nav>li>a {
          font-size: 14px;
          padding-bottom: 6px;
          padding-left: 15px;
          padding-top: 15px;
      }
  }
  
  
  @media (max-width: 991px) {
      #myDerbyLogo {
          height: auto;
          margin-left: auto -100px;
          margin-right: auto;
          margin-top: 0px;
          width: 160px;
          z-index: 4000;
      }
  }
  .HeaderBottomBar {
      background-color: #fff;
      border-top: none !important;
      box-shadow: none !important;
      display: none !important;
      height: 0 !important;
      margin-top: 0 !important;
      position: fixed;
      width: 100%;
      z-index: 1500;
  }
  footer {
      background: #000;
      color: #fff;
      height: 80px;
      left: 0px;
      width: 100%;
  }
  .jumbotron {
      background-color: rgba(255, 255, 255, 0);
      color: inherit;
      margin-bottom: 30px;
      padding-bottom: 30px;
      padding-top: 30px;
      display: none;
  }
  .footerlogocontainer {
      margin-top: 20px;
      width: 260px;
  }
  .OuterContent {
      margin-bottom: 100px;
      padding: 10px;
      flex: 1;
  }
  .InnerContent {
      background: #fff;
      
      height: 100%;
      padding: 0px;
      width: 100%;
  }
  .PageTitleDiv {
      
      
      border-left: 0px;
      border-right: 0px;
      border-top: 0px;
      color: var(--pt-palette-0);
      
      font-size: 26px;
      font-weight: 600;
      height: 80px;
      letter-spacing: .4px;
      padding-top: 21px;
      text-align: center;
      width: 100%;
  }
  .PageTitleDivThin {
      color: #111;
      font-family: 'Roboto Slab', serif;
      font-size: 26px;
      font-weight: 300;
      letter-spacing: .4px;
      text-decoration: none;
  }
  .SubPageTitleDiv {
      background: #fff;
      border-bottom: 0px;
      border-left: 0px;
      border-right: 0px;
      border-top: 0px;
      height: 58px;
      overflow: hidden;
      padding-top: 19px;
      text-align: center;
      transition: height ease-in-out .5s;
      width: 100%;
  }
  .SubPageTitleDivDataStatic {
      background: #fff;
      border-bottom: 0px;
      border-left: 0px;
      border-right: 0px;
      border-top: 0px;
      height: 96px;
      overflow: hidden;
      padding-top: 19px;
      text-align: center;
      width: 100%;
  }
  .SubPageTitleDivData {
      background: #fff;
      border-bottom: 0px;
      border-left: 0px;
      border-right: 0px;
      border-top: 0px;
      overflow: hidden;
      padding-bottom: 15px;
      padding-top: 19px;
      text-align: center;
      width: 100%;
  }
  .TextDivider {
      Margin-left: 10px;
      margin-right: 10px;
  }
  .DownDivider {
      height: auto;
      width: 100%;
      display: none;
  }
  .MainContent {
      margin-top: 0px;
      padding: 15px;
      padding-bottom: 40px;
      padding-top: 0px;
  }
  .StrongText {
      font-weight: 600;
      padding-right: 10px;
      text-transform: uppercase;
  }
  .navbar-inverse .navbar-toggle {
      background-color: black;
      border-color: #333;
  }
  @media (max-width: 1199px) {
      .jumbotron {
          background-color: none;
          color: inherit;
          margin-bottom: 30px;
          padding-bottom: 0px;
          padding-top: 0px;
          display: none;
      }
  }
  @media (max-width: 991px) {
      h1.Hero {
          color: #fff;
          font-family: 'Metrophobic', Arial, serif;
          font-size: 40px;
          font-weight: 700;
          text-shadow: 2px 2px 2px rgba(0, 0, 0, .85);
      }
      h3.Hero {
          color: #fff;
          font-family: 'Metrophobic', Arial, serif;
          font-size: 25px;
          font-weight: 200;
          margin-bottom: -20px;
          text-shadow: 2px 2px 2px rgba(0, 0, 0, .85);
      }
      .jumbotron {
          background-color: none;
          color: inherit;
          margin-bottom: 10px;
      }
  }
  @media (max-width: 767px) {
      .navbar-inverse .navbar-nav>.active>a,
      .navbar-inverse .navbar-nav>.active>a:focus,
      .navbar-inverse .navbar-nav>.active>a {
          background-color: rgba(0, 0, 0, .7);
          color: #fff;
      }
      .navbar-inverse .navbar-nav>.active>a,
      .navbar-inverse .navbar-nav>.active>a:focus,
      .navbar-inverse .navbar-nav>.active>a:hover {
          background-color: rgba(0, 0, 0, .9);
          color: #fff;
      }
      .navbar-inverse .navbar-nav>li>a {
          background-color: black;
          color: #fff;
          padding-bottom: 20px;
          padding-top: 20px;
      }
      .navbar-inverse .navbar-nav>li>a:hover {
          background-color: var(--pt-palette-16);
          color: var(--pt-palette-0);
          padding-bottom: 20px;
          padding-top: 20px;
      }
      .navbar-inverse .navbar-collapse,
      .navbar-inverse .navbar-form {
          border-color: rgba(0, 0, 0, 0);
      }
      .navbar {
          height: 60px;
      }
      .HeaderBottomBar {
          display: none;
      }
      footer {
          position: relative;
      }
      #uodlogo {
          margin-top: -1px;
          width: 130px;
      }
      body {
          padding-top: 70px;
      }
      .jumbotron {
          background-color: rgba(255, 255, 255, 0);
          color: inherit;
          margin-bottom: -5px;
          padding-bottom: 0px;
          padding-top: 30px;
      }
      h1.Hero {
          color: #fff;
          font-family: 'Metrophobic', Arial, serif;
          font-size: 40px;
          font-weight: 700;
          text-shadow: 2px 2px 2px rgba(0, 0, 0, .85);
      }
      h2.Hero {
          color: #fff;
          font-family: 'Metrophobic', Arial, serif;
          font-size: 28px;
          font-weight: 700;
          text-shadow: 2px 2px 2px rgba(0, 0, 0, .85);
      }
      h3.Hero {
          color: #fff;
          font-family: 'Metrophobic', Arial, serif;
          font-size: 22px;
          font-weight: 200;
          margin-bottom: -20px;
          text-shadow: 2px 2px 2px rgba(0, 0, 0, .85);
      }
      #navbar {
          clear: both;
          
          position: absolute;
          width: 100%;
          z-index: 99999999;
      }
      h2 {
          font-family: 'Metrophobic', Arial, serif;
          font-size: 20px;
          font-weight: 600;
      }
  }
  @media (max-width: 400px) {
      #navbar {
          margin-top: -9px;
      }
  }
  .AccountDiv {
      background: none;
      clear: both;
      float: right;
      font-family: sans-serif;
      font-size: .9em;
      height: 26px;
      margin-left: -196px;
      margin-top: 3px;
      padding-top: 2px;
      position: fixed;
      text-align: right;
      width: 483px;
  }
  @media (max-width: 991px) {
      .AccountDiv {
          background: none;
          clear: both;
          float: right;
          font-family: sans-serif;
          font-size: .8em;
          height: 26px;
          margin-left: -214px;
          margin-top: 3px;
          padding-top: 4px;
          position: fixed;
          text-align: right;
          width: 431px;
      }
      h2 {
          font-family: 'Metrophobic', Arial, serif;
          font-size: 24px;
          font-weight: 600;
      }
  }
  @media (max-width: 550px) {
      body {
          background-position: top center;
          background-size: 160% auto;
          font-size: 1.2em;
      }
      h1.Hero {
          color: #fff;
          font-family: 'Metrophobic', Arial, serif;
          font-size: 28px;
          font-weight: 700;
          text-shadow: 2px 2px 2px rgba(0, 0, 0, .85);
      }
      h2.Hero {
          color: #fff;
          font-family: 'Metrophobic', Arial, serif;
          font-size: 22px;
          font-weight: 200;
          margin-bottom: -20px;
          text-shadow: 2px 2px 2px rgba(0, 0, 0, .85);
      }
      h2 {
          font-family: 'Metrophobic', Arial, serif;
          font-size: 20px;
          font-weight: 600;
      }
      h3.Hero {
          color: #fff;
          font-family: 'Metrophobic', Arial, serif;
          font-size: 16px;
          font-weight: 200;
          margin-bottom: -20px;
          text-shadow: 2px 2px 2px rgba(0, 0, 0, .85);
      }
      .PageTitleDiv {
          
          
          border-left: 0px;
          border-right: 0px;
          border-top: 0px;
          color: #111;
          
          
          
          height: 56px;
          letter-spacing: .4px;
          padding-top: 12px;
          text-align: center;
          width: 100%;
      }
      .SubPageTitleDiv {
          background: #fff;
          border-bottom: 0px;
          border-left: 0px;
          border-right: 0px;
          border-top: 0px;
          height: 38px;
          padding-top: 11px;
          text-align: center;
          width: 100%;
      }
      #uodfooter {
          margin-top: -3px;
          opacity: .3;
          width: 130px;
      }
  }
  @media (max-width: 650px) {
      footer {
          background: #000;
          bottom: 0px;
          color: #fff;
          height: 57px;
          left: 0px;
          width: 100%;
      }
  }
  @media (max-width: 767px) {
      #uodfooter {
          margin-top: 0px;
          opacity: .3;
          width: 130px;
      }
      footer {
          background: #000;
          bottom: 0px;
          color: #fff;
          height: 63px;
          left: 0px;
          position: relative;
          width: 100%;
      }
  }
  .FooterMenu {
      background: none;
      border: none;
      color: #4C4C4C;
      float: right;
      font-size: .85em;
      height: 20px;
      padding-top: 21px;
      text-align: right;
      width: 80%;
  }
  .FooterMenu a {
      color: #ccc;
      padding-left: 8px;
      padding-right: 8px;
  }
  .FooterMenu a:hover {
      color: #fff;
  }
  @media (min-width: 767px) {
      .FooterMenu {
          background: none;
          border: none;
          color: #4C4C4C;
          float: right;
          font-size: .85em;
          height: 20px;
          padding-top: 30px;
          text-align: right;
          width: 80%;
      }
      .FooterMenu a {
          color: #D9D7D0;
          padding-left: 8px;
          padding-right: 8px;
      }
      .FooterMenu a:hover {
          color: #fff;
      }
  }
  .btn-Wide {
      background-color: black;
      border-color: black;
      border-radius: 3rem;
      color: white;
      font-size: 1.1em;
      font-weight: 400;
      padding-bottom: 15px;
      padding-left: 25px;
      padding-right: 25px;
      padding-top: 15px;
      width: 100%;
  }
  .btn-Wide:hover {
      background-color: white;
      color: black;
  }
  .btn-Wide:focus {
      background-color: black;
      color: white;
  }
  .btn-WideAlt {
      background-color: #74736F;
      
      border-radius: 3rem;
      white-space: normal;
      
      
      color: #FFF;
      font-size: 1.1em;
      font-weight: 400;
      min-width: 170px;
      padding-bottom: 15px;
      padding-left: 25px;
      padding-right: 25px;
      padding-top: 15px;
      
      width: 100%;
  }
  .btn-WideAlt:hover {
      background-color: #000000;
      color: #FFF;
  }
  .btn-Small {
      width: fit-content;
      padding-left: 20px;
      padding-right: 20px;
      padding-top: 7px;
      padding-bottom: 7px;
      margin: 2px;
  }
  .btn-Medium {
      width: 65%;
      padding-left: 20px;
      padding-right: 20px;
      padding-top: 7px;
      padding-bottom: 7px;
  }
  .FormTopPadding {
      padding-top: 30px;
  }
  @media (max-width: 767px) {
      .FormTopPadding {
          padding-top: 0px;
      }
  }
  .form-control {
      background-color: white;
      background-image: none;
      border: 1px solid #ccc;
      border-radius: 1rem;
      box-shadow: none;
      color: #555;
      display: block;
      font-size: 14px;
      height: 45px;
      line-height: 1.42857143;
      margin-bottom: 7px;
      margin-top: 6px;
      o-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
      padding: 6px 12px;
      transition: none !important;
      webkit-box-shadow: none !important;
      webkit-transition: none !important;
      width: 100%;
  }
  .form-horizontal .control-label {
      margin-bottom: 0;
      padding-top: 17px;
      text-align: right;
  }
  .OrDivider {
      font-size: .8em;
      padding-bottom: 20px;
      padding-top: 20px;
      text-align: center;
  }
  .FieldIconAccount {
      background: url(/cs/HPRDOLA2/cache86011/UD_OLA_FIELDICON_ACCOUNT_1.png);
      background-color: #F6F6F5;
      background-repeat: no-repeat;
      padding-left: 50px;
  }
  .FieldIconEmail {
      background: url(/cs/HPRDOLA2/cache86011/UD_OLA_FIELDICON_EMAIL_1.png);
      background-color: #F6F6F5;
      background-repeat: no-repeat;
      padding-left: 50px;
  }
  .FieldIconPassword {
      background: url(/cs/HPRDOLA2/cache86011/UD_OLA_FIELDICON_PASSWORD_1.png);
      background-color: #F6F6F5;
      background-repeat: no-repeat;
      padding-left: 50px;
  }
  .CourseDescription {
      font-size: 1em;
      height: 100%;
      padding-left: 20px;
      padding-right: 20px;
      text-align: left;
  }
  .CourseDescription:hover {
      height: 100%;
      padding-left: 20px;
      padding-right: 20px;
      text-align: left;
  }
  .ViewMoreContainer {
      margin-bottom: 10px;
      margin-right: 0px;
      margin-top: -46px;
      padding-top: 3px;
      position: relative;
      width: 100%;
  }
  .ViewMoreLink {
      background: #B3B2B2;
      border-radius: 5px;
      bottom: 5px;
      color: #fff;
      float: right;
      font-size: .9em;
      margin-bottom: 10px;
      margin-left: 15px;
      margin-top: 10px;
      padding-bottom: 7px;
      padding-left: 9px;
      padding-right: 9px;
      padding-top: 7px;
      position: relative;
      text-align: center;
  }
  .ViewMoreLink:hover {
      background: #000;
      color: #fff;
      text-decoration: none;
  }
  .CourseName {
      font-size: 1.2em;
      font-weight: bold;
  }
  .DataTable {
      margin-bottom: 25px;
      margin-top: 30px;
      padding: 5px;
  }
  .DataTableHeaders {
      font-size: 1em;
      font-weight: bold;
  }
  h2.PageSubName {
      color: black;
      font-family: sans-serif;
      font-size: 22px;
      
      
      padding-top: 25px;
  }
  .pager li>a,
  .pager li>span {
      background-color: #fff;
      border: 1px solid #ddd;
      border-radius: 7px;
      display: inline-block;
      padding: 5px 14px;
  }
  .LargeMarginTop {
      margin-top: 50px;
  }
  .MediumMarginTop {
      margin-top: 35px;
  }
  .SmallMarginTop {
      margin-top: 20px;
  }
  .ExtraSmallMarginTop {
      margin-top: 7px;
  }
  @media (max-width: 767px) {
      .LargeMarginTop {
          margin-top: 20px;
      }
      .MediumMarginTop {
          margin-top: 14px;
      }
      .SmallMarginTop {
          margin-top: 6px;
      }
      .ExtraSmallMarginTop {
          margin-top: 4px;
      }
  }
  .form-horizontal .control-label-fix {
      margin-bottom: 15px;
      padding-top: 8px;
      text-align: right;
  }
  .ProgressBarContainer {
      height: 60px;
      margin-left: auto;
      margin-right: auto;
      margin-top: -8px;
      text-align: center;
  }
  .ProgressBarContainerComplete {
      height: 60px;
      margin-left: auto;
      margin-right: auto;
      margin-top: -8px;
      opacity: .45;
      text-align: center;
  }
  .ProgressImages {
      height: 40px;
      margin-top: 7px;
      width: auto;
      margin-left: -4px;
  }
  .ProgressStepText {
      color: #666;
      display: inline-block;
      font-size: .8em;
      line-height: 11px;
      margin-top: 2px;
      width: 92px;
  }
  @media (max-width: 767px) {
      .ProgressImages {
          height: 30px;
          margin-top: 12px;
          width: auto;
      }
      .ProgressStepText {
          color: #666;
          display: inline-block;
          font-size: .75em;
          line-height: 11px;
          margin-top: 2px;
          max-width: 69px;
          overflow: hidden;
          width: 20%;
      }
  }
  .btn-MiniSearch {
      background-color: #609dd5;
      border-radius: 7px;
      color: #FFF;
      font-weight: 400;
      margin-top: 6px;
      padding-bottom: 12px;
      padding-left: 25px;
      padding-right: 25px;
      padding-top: 11px;
  }
  .navbar-inverse .navbar-nav>li>a:focus {
      color: #559AD1;
  }
  @media (max-width: 767px) {
      .navbar-inverse .navbar-nav>li>a:focus {
          background: #559AD1;
          color: #fff;
      }
  }
  #preloader {
      background-color: #fff;
      height: 100%;
      left: 0px;
      position: fixed;
      top: 0px;
      width: 100%;
      z-index: 99;
  }
  #status {
      background-image: url(/cs/HPRDOLA2/cache86011/UD_OLA_LOADER_1.gif);
      background-position: center;
      background-repeat: no-repeat;
      height: 200px;
      left: 50%;
      margin: -100px 0 0 -100px;
      position: absolute;
      top: 50%;
      width: 200px;
  }
  @media (max-width: 400px) {
      .SubPageTitleDivDataStatic {
          background: #fff;
          border-bottom: 0px;
          border-left: 0px;
          border-right: 0px;
          border-top: 0px;
          height: 62px;
          overflow: hidden;
          padding-top: 7px;
          text-align: center;
          width: 100%;
      }
      .PageTitleDiv {
          
          
          border-left: 0px;
          border-right: 0px;
          border-top: 0px;
          color: #111;
          
          
          
          height: 38px;
          letter-spacing: .4px;
          padding-top: 5px;
          text-align: center;
          width: 100%;
      }
      h2.PageSubName {
          color: #111;
          font-family: 'Roboto Slab', serif;
          font-size: 16px;
          font-weight: 400;
          letter-spacing: .4px;
          padding-top: 19px;
      }
      legend {
          border: 0;
          border-bottom: 1px solid #e5e5e5;
          color: #333;
          display: block;
          font-size: 21px;
          line-height: inherit;
          margin-bottom: 8px;
          padding: 0;
          width: 100%;
      }
      .form-horizontal .control-label {
          margin-bottom: 0;
          padding-top: 0px;
          text-align: left;
      }
      .btn-Wide {
          
          
          
          
          
          
          
          
          
          
          
          
          
          
      }
      .row {
          margin-left: -15px;
          margin-right: -15px;
      }
      .table-responsive {
          border: 1px solid #ddd;
          margin-bottom: 15px;
          margin-top: 15px;
          ms-overflow-style: -ms-autohiding-scrollbar;
          overflow-y: hidden;
          width: 100%;
      }
      body {
          font-size: 1em;
      }
      .form-control {
          background-color: #f6f6f5;
          background-image: none;
          border: 1px solid #ccc;
          border-radius: 7px;
          box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
          color: #555;
          display: block;
          font-size: 12px;
          height: 36px;
          line-height: 1.42857143;
          margin-bottom: 10px;
          margin-top: -1px;
          o-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
          padding: 6px 12px;
          transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
          webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
          webkit-transition: border-color ease-in-out .15s, -webkit-box-shadow ease-in-out .15s;
          width: 100%;
      }
      .checkbox input[type=checkbox],
      .checkbox-inline input[type=checkbox],
      .radio input[type=radio],
      .radio-inline input[type=radio] {
          margin-left: -20px;
          margin-top: 0px;
          position: absolute;
      }
      .OrDivider {
          font-size: .8em;
          padding-bottom: 10px;
          padding-top: 10px;
          text-align: center;
      }
      .SubPageTitleDiv {
          background: #fff;
          border-bottom: 0px;
          border-left: 0px;
          border-right: 0px;
          border-top: 0px;
          height: 38px;
          padding-top: 14px;
          text-align: center;
          width: 100%;
      }
      .btn-WideAlt {
          background-color: #74736F;
          
          
          border-radius: 3rem;
          
          color: #FFF;
          font-size: 1.1em;
          font-weight: 400;
          min-width: 170px;
          padding-bottom: 11px;
          padding-left: 25px;
          padding-right: 25px;
          padding-top: 11px;
          
          width: 100%;
      }
      .navbar {
          height: 50px;
      }
      #uodlogo {
          margin-top: -4px;
          width: 116px;
      }
      .navbar-toggle {
          background-color: transparent;
          background-image: none;
          border: 1px solid transparent;
          border-radius: 1rem;
          float: right;
          margin-bottom: 8px;
          margin-right: 15px;
          margin-top: 6px;
          padding: 7px 10px;
          padding-bottom: 7px;
          padding-left: 10px;
          padding-right: 10px;
          padding-top: 7px;
          position: relative;
      }
      .navbar-nav {
          
          
      }
  }
  @media (max-width: 400px) {
      .ProgressImages {
          height: 29px;
          margin-top: 12px;
          width: auto;
      }
      .ProgressStepText {
          color: #666;
          display: inline-block;
          font-size: .85em;
          line-height: 7px;
          margin-top: 2px;
          max-width: 69px;
          overflow: hidden;
          width: 20%;
      }
  }
  @media (max-width: 375px) {
      .ProgressImages {
          height: 22px;
          margin-top: 12px;
          width: auto;
      }
      .ProgressStepText {
          color: #666;
          display: inline-block;
          font-size: .85em;
          line-height: 7px;
          margin-top: 2px;
          max-width: 69px;
          overflow: hidden;
          width: 20%;
      }
      .FooterMenu a {
          color: #ccc;
          padding-left: 4px;
          padding-right: 4px;
      }
  }
  .checkbox-inline,
  .radio-inline {
      cursor: pointer;
      display: inline-block;
      font-weight: 400;
      margin-bottom: 15px;
      padding-left: 20px;
      position: relative;
      vertical-align: middle;
  }
  h2.NoTopPadding {
      padding-top: 0px;
  }
  .Help {
      color: #777;
      display: block;
      float: right;
      font-size: 22px;
      height: 31px;
      margin-right: -37px;
      margin-top: -43px;
      position: relative;
      width: 30px;
  }
  .Help:hover {
      color: #000;
      cursor: help;
      display: block;
      float: right;
      font-size: 22px;
      height: 31px;
      margin-right: -37px;
      margin-top: -43px;
      position: relative;
      width: 30px;
  }
  .wrapper {
      color: #666;
      cursor: help;
      float: right;
      font-size: 21px;
      height: 28px;
      margin-right: -40px;
      margin-top: -44px;
      padding-right: 14px;
      position: relative;
      text-align: center;
      width: 30px;
  }
  .wrapper-crsinfo {
      color: #666;
      cursor: help;
      float: right;
      font-size: 21px;
      height: 28px;
      margin-top: -44px;
      margin-right: 60px;
      position: relative;
      text-align: center;
      width: 30px;
  }
  .wrapper .tooltip {
      background: var(--pt-palette-0);
      bottom: 100%;
      box-shadow: 2px 2px 6px rgba(0, 0, 0, 0.28);
      color: #fff;
      display: block;
      height: 35px;
      left: -175px;
      margin-bottom: 15px;
      moz-box-shadow: 2px 2px 6px rgba(0, 0, 0, 0.28);
      moz-transform: translateY(10px);
      moz-transition: all .25s ease-out;
      ms-box-shadow: 2px 2px 6px rgba(0, 0, 0, 0.28);
      ms-transform: translateY(10px);
      ms-transition: all .25s ease-out;
      o-box-shadow: 2px 2px 6px rgba(0, 0, 0, 0.28);
      opacity: 0;
      o-transform: translateY(10px);
      o-transition: all .25s ease-out;
      padding: 10px;
      pointer-events: none;
      position: absolute;
      text-align: center;
      transform: translateY(10px);
      transition: all .25s ease-out;
      webkit-box-shadow: 2px 2px 6px rgba(0, 0, 0, 0.28);
      webkit-transform: translateY(10px);
      webkit-transition: all .25s ease-out;
      width: 120px;
  }
  .wrapper .tooltip:before {
      bottom: -20px;
      content: " ";
      display: block;
      height: 20px;
      left: 0;
      position: absolute;
      width: 100%;
  }
  .wrapper .tooltip:after {
      border-left: solid transparent 10px;
      border-right: solid transparent 10px;
      border-top: solid var(--pt-palette-0) 10px;
      bottom: -10px;
      content: " ";
      height: 0;
      left: 50%;
      margin-left: -13px;
      position: absolute;
      width: 0;
  }
  .wrapper:hover .tooltip {
      moz-transform: translateY(0px);
      ms-transform: translateY(0px);
      opacity: 1;
      o-transform: translateY(0px);
      pointer-events: auto;
      transform: translateY(0px);
      webkit-transform: translateY(0px);
  }
  .lte8 .wrapper .tooltip {
      display: none;
  }
  .lte8 .wrapper:hover .tooltip {
      display: block;
  }
  .help_small {
      float: right;
      height: 12px;
      margin-top: -5px;
      padding: 0;
      position: relative;
      text-align: right;
      width: 100%;
  }
  @media (max-width: 400px) {
      .form-horizontal .checkbox,
      .form-horizontal .radio {
          height: 10px;
          padding-bottom: 10px;
      }
      .form-horizontal .checkbox,
      .form-horizontal .radio {
          min-height: 10px;
      }
      .form-horizontal .checkbox,
      .form-horizontal .checkbox-inline,
      .form-horizontal .radio,
      .form-horizontal .radio-inline {
          margin-bottom: 0;
          margin-top: 0;
          padding-top: 6px;
      }
  }
  .OuterContent .modal-open {
      margin-left: 50px;
  }
  .RequirementText {
      float: right;
      font-size: .9em;
  }
  .RequirementIndicatorGreen {
      float: right;
      border: 1px solid #ccc;
      height: 17px;
      width: 17px;
      background: green;
      border-radius: 50%;
      margin-bottom: 7px;
      margin-right: 5px;
  }
  .RequirementIndicatorRed {
      float: right;
      border: 1px solid #ccc;
      height: 17px;
      width: 17px;
      background: red;
      border-radius: 50%;
      margin-bottom: 7px;
      margin-right: 5px;
  }
  td.SummaryCol1 {
      width: 25%;
      text-align: right;
      font-weight: 600;
      background: #F2F3F5;
  }
  td.SummaryCol2 {
      width: 25%;
      color: #777;
  }
  td.SummaryCol3 {
      width: 25%;
      text-align: right;
      font-weight: 600;
      background: #F2F3F5;
  }
  td.SummaryCol4 {
      width: 25%;
      color: #777;
  }
  td.WideSummaryCol1 {
      width: 50%;
      text-align: left;
      font-weight: 400;
      color: red;
  }
  td.WideSummaryCol2 {
      width: 50%;
      text-align: left;
      font-weight: 400;
      color: red;
  }
  .SummaryEditButton {
      display: block;
      
      background: #e54f00;
      padding-right: 14px;
      padding-left: 14px;
      padding-top: 4px;
      padding-bottom: 4px;
      height: 100%;
      float: right;
      text-align: center;
      
      color: #fff;
      border-radius: 3rem;
  }
  .SummaryEditButton:hover {
      background: var(--pt-palette-0);
      color: white;
      text-decoration: none;
  }
  .tt-menu {
      background: white;
  }
  .row {
      margin-right: 0px !important;
      margin-left: 0 !important;
  }


.PSMODALTABLE {
    top: 30% !important;
}
#pt_modalMask { 
    height: 100% !important; 
    width: 100% !important; 
}