@font-face {
    font-family: Lato;
    src: url('/Fonts/Lato-Regular.ttf');
}

@font-face {
    font-family: Roboto;
    src: url('/Fonts/Roboto-Regular.ttf');
}

@font-face {
    font-family: Button;
    src: url('/Fonts/EncodeSansSemiCondensed-Bold.ttf');
}

@font-face {
    font-family: Raleway;
    src: url('/Fonts/Raleway-VariableFont_wght.ttf');
}

@font-face {
    font-family: 'Courier New';
    src: url('/Fonts/Roboto-Regular.ttf');
}

@media screen {
    html {
        scroll-padding-top: 130px; /* height of fixed header so scrollIntoView works correctly. */
    }
}

@media print {
    a:link /* Remove Hyperlinks */ {
        border-bottom: none !important;
        text-decoration: none !important;
    }

    a[href]:after {
        content: none !important;
    }

    img {
        max-width: 100%; /* Ensures the image doesn't exceed the page width */
        max-height: 95vh; /* Prevents the image from overflowing vertically on a page */
        width: auto; /* Maintains the image's aspect ratio */
        break-inside: avoid; /* Prevents the image from being cut in half across pages */
    }
}

.Page_Break {
    break-before: page;
}

.Print_No_Break {
    break-inside: avoid;
    padding: 4px 0;
}

.SpacerR {
    margin-right: 20px;
}

/* Colors ****************/
.Blue {
    color: blue !important;
}

.BBlue {
    color: blue !important;
    font-weight: bold !important;
}

.BBlack {
    color: black !important;
    font-weight: bold !important;
}

.Red /* Note: some embedded classes are also redefining .Red so use .RedText instead. */ {
    color: #cc0000 !important;
}

.RedT /* This is for td tags which alread have a class called Red that changes the background to red. */ {
    color: #cc0000 !important;
}

.GreenT /* This is for td tags which alread have a class called Green that changes the background to green. */ {
    color: #068206 !important;
}

.RedBB {
    font-weight: bold;
    color: #cc0000 !important;
    font-size: 11pt;
}

.RedS {
    font-size: 9pt !important;
    color: #cc0000 !important;
}

.GreenS {
    font-size: 9pt !important;
    color: #068206 !important;
}

.RedText {
    color: #cc0000 !important;
    font-weight: 900 !important;
}

.GreenText {
    color: #068206 !important;
    font-weight: 900 !important;
}

.BlueText {
    color: #0000cc !important;
    font-weight: 900 !important;
}

.DBlueText {
    color: #0000aa !important;
    font-weight: 900 !important;
}

.PurpleText {
    color: purple !important;
    font-weight: 900 !important;
}

.Black {
    color: Black !important;
    font-weight: 900 !important;
}

.DRed {
    color: #aa0000 !important;
}

.BRed {
    color: #cc0000 !important;
    font-weight: 900 !important;
}

.RedBK {
    background-color: #cc0000 !important;
}

.Green {
    color: #068206 !important;
}

.DGreen {
    color: #006600 !important;
}

.BGreen {
    color: #068206 !important;
    font-weight: bold !important;
}

.Purple {
    color: purple !important;
}

.BPurple {
    color: purple !important;
    font-weight: bold !important;
}

.Yellow {
    color: yellow !important;
}

.BYellow {
    color: yellow !important;
    font-weight: bold !important;
}

.Orange {
    color: #cc3300 !important;
}

.BOrange {
    color: #cc3300 !important;
    font-weight: bold !important;
}

.Brown {
    color: #A52A2A !important;
}

.BBrown {
    color: #A52A2A !important;
    font-weight: bold !important;
}

.Ivory {
    color: #ffffe0 !important;
}

.BIvory {
    color: #ffffe0 !important;
    font-weight: bold !important;
}

.Gray {
    color: #cccccc !important;
}

.BGray {
    color: #cccccc !important;
    font-weight: bold !important;
}

.BOrange {
    font-weight: bold !important;
    color: #ee4400 !important;
    background-color: transparent;
}

.SRed {
    color: #cc0000 !important;
    font-size: 7pt !important;
}

.BG_Gray {
    background-color: #dddddd !important;
}

.BG_Ivory {
    background-color: #fff8d8 !important;
}

.BG_Red {
    background-color: #cc0000 !important;
    color: white;
}

.BG_Green {
    background-color: #b2f2b2 !important;
}

.BG_Purple {
    color: #ffffff !important;
    background-color: #ddddff !important;
}

.BG_Blue {
    background-color: #7278fa !important;
}

.BG_Light_Blue {
    background-color: #cce6ff !important;
}

.BG_Orange {
    background-color: #fcc47a !important;
}

.BG_Yellow {
    background-color: #ffffaa !important;
}

.F11 {
    font-size: 11pt !important;
}

.F12 {
    font-size: 12pt !important;
}

.F13 {
    font-size: 13pt !important;
}

.F14 {
    font-size: 14pt !important;
}

html {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

body {
    color: #000000;
    font-family: Roboto, Arial, Sans-Serif;
    font-size: 11pt;
    background-color: #ffffff;
    margin: 0;
    padding: 0;
    min-height: 100vh;
}

/* Control Defaults ************************************************************/
video {
    width: 100%;
    height: auto;
    object-fit: cover;
}

fieldset {
    border: 1px solid #ddd;
    padding: 0 1.4em 1.4em 1.4em;
    margin: 0 0 1.5em 0;
}

legend {
    font-size: 1.2em;
    font-weight: bold;
}

label {
    font-weight: bold;
}

input[type="checkbox"] {
    accent-color: blue;
}

input[type="radio"] {
    accent-color: blue;
}

button {
    cursor: pointer;
    color: black;
    font-weight: normal;
    font-family: Button, Tahoma, sans-serif;
    font-size: 10pt;
    border: 2px outset #dddddd;
    background-image: linear-gradient(to bottom, #f0f0f0 0%,#cccccc 100%);
    margin: 4px !important;
}

    button:hover {
        color: #0000ff;
        box-shadow: inset 0 0 7px rgba(20, 240, 250, 0.50);
    }

input[type="button"] {
    cursor: pointer;
    color: black;
    font-weight: normal;
    font-family: Button, Tahoma, sans-serif;
    font-size: 10pt;
    border: 2px outset #dddddd;
    background-image: linear-gradient(to bottom, #f0f0f0 0%,#cccccc 100%);
    margin: 4px !important;
}

    input[type="button"]:hover {
        color: #0000ff;
        box-shadow: inset 0 0 7px rgba(20, 240, 250, 0.50);
    }

input[type="submit"] {
    cursor: pointer;
    color: black;
    font-weight: normal;
    font-family: Button, Tahoma, sans-serif;
    font-size: 10pt;
    border: 2px outset #dddddd;
    background-image: linear-gradient(to bottom, #f0f0f0 0%,#cccccc 100%);
    margin: 4px !important;
}

    input[type="submit"]:hover {
        color: #0000ff;
        box-shadow: inset 0 0 7px rgba(20, 240, 250, 0.50);
    }

textarea {
    font-weight: bold;
    font-size: 10pt;
    color: #000055;
    margin: 0 2px;
}

input[type="text"] {
    font-weight: bold;
    font-size: 10pt;
    padding: 2px 3px;
    color: #000055;
    margin: 0 2px;
}

input[type="number"] {
    font-weight: bold;
    font-size: 10pt;
    padding: 2px 3px;
    color: #000055;
    margin: 0 2px;
}

input[type="date"] {
    font-weight: bold;
    font-size: 10pt;
    color: #000055;
    margin: 0 2px;
}

input[type="file"] {
    font-weight: bold;
    font-size: 10pt;
    color: #000055;
    margin: 0 2px;
}

select {
    font-weight: bold;
    font-size: 10pt;
    color: #000000;
    margin: 0 2px;
}

option {
    font-weight: bold;
    font-size: 10pt;
}

li {
    padding-bottom: 5px;
}

ul.teardrop {
    list-style-image: url(/images/bullets/drop.jpg)
}

a {
    font-weight: bold;
    color: #000000;
    cursor: pointer;
}

    a:hover {
        text-shadow: 0 0 5px #ffffcc;
    }

/* End of Control Defaults ***********************************************************/

input.File {
    width: 400px;
    font-size: 11pt;
}

select.M250 {
    max-width: 250px;
}

input.ChkBox {
    outline: 2px outset black;
}

.Bullet {
    vertical-align: middle;
    font-weight: bold;
    font-size: 16pt;
}

::placeholder {
    color: #bbbbbb;
    opacity: 1; /* Firefox */
}

.Item {
    white-space: nowrap;
    margin-right: 15px;
}

.W100 {
    width: 100%;
}

.Hint {
    text-align: left;
    font-style: italic;
    font-weight: normal;
    font-size: 9pt;
}

.Spacer {
    margin-right: 25px;
}

@media print {
    .NoPrint {
        display: none !important;
    }
}

.Highlight {
    background-color: #ffff99;
}

.BArrow {
    font-size: 20pt;
    color: blue;
    vertical-align: sub;
}

.BArrowS {
    font-size: 16pt;
    color: blue;
    vertical-align: sub;
}

.NoWrap {
    white-space: nowrap;
}

.NoWrapSpc {
    white-space: nowrap;
    padding: 4px 0;
}

.F9 {
    font-size: 9pt !important;
}

.F8 {
    font-size: 8pt !important;
}

.F7 {
    font-size: 7pt !important;
}

.Diagram {
    margin: 0 4px;
    padding: 3px 2px;
    display: inline-table;
    border: 1px solid #aaaaaa;
    text-align: center;
    vertical-align: middle;
    font-size: 9pt;
    font-weight: bold;
}

.DiagramS {
    margin: 0 3px;
    padding: 3px 1px;
    display: inline-table;
    border: 1px solid #aaaaaa;
    text-align: center;
    vertical-align: middle;
    font-size: 8pt;
    font-weight: bold;
}

img.Question {
    margin-left: 15px;
    vertical-align: bottom;
}

.Middle {
    vertical-align: middle !important;
}

.Left {
    text-align: left;
}

.Right {
    text-align: right;
}

.Center {
    text-align: center;
}

.Section {
    text-align: center;
    padding: 5px;
    font-weight: bold;
    font-size: 12pt;
}

a.Big {
    font-family: 'Arial Black', 'Arial Rounded MT', Arial, sans-serif;
    font-size: 11pt !important;
    font-weight: bold;
}

    a.Big:hover {
        background-color: #ffff55;
    }

.Middle {
    vertical-align: middle !important;
}

.Bottom {
    vertical-align: bottom !important;
}

.Top {
    vertical-align: top !important;
}

span.Radio {
    margin-right: 18px;
}

label.Radio {
    margin-right: 18px;
}

div.Button_Bar {
    text-align: center;
    padding: 15px;
}

div.RowL {
    text-align: left;
    padding: 3px;
    white-space: nowrap;
}

div.RowC {
    text-align: center;
    padding: 3px;
    white-space: nowrap;
}

div.RowR {
    text-align: right;
    padding: 3px;
    white-space: nowrap;
}

div.RedOn {
    background-color: #cc0000;
    color: white;
    font-weight: bold;
    text-align: center;
    padding: 3px;
}

div.TopPad {
    padding-top: 10px;
}

div.GreenOn {
    background-color: lightgreen;
    color: black;
    font-weight: bold;
    text-align: center;
    padding: 3px;
}

div.PanelC {
    text-align: center;
    font-weight: bold;
    font-size: 11pt;
    padding: 20px;
}

div.InfoBlock {
    text-align: center;
    font-weight: bold;
    font-size: 11pt;
    padding: 15px;
    color: #cc0000;
}

div.Title {
    text-align: center;
    font-size: 14pt !important;
    font-weight: bold;
    padding: 20px;
}

div.Title10 {
    color: black;
    text-align: center;
    font-size: 10pt !important;
    font-weight: bold;
    padding: 6px;
}

div.Title11 {
    color: black;
    text-align: center;
    font-size: 11pt !important;
    font-weight: bold;
    padding: 6px;
}

div.Title12 {
    color: black;
    text-align: center;
    font-size: 12pt !important;
    font-weight: bold;
    padding: 6px;
}

div.Title13 {
    color: black;
    text-align: center;
    font-size: 13pt !important;
    font-weight: bold;
    padding: 6px;
}

div.Title14 {
    color: black;
    text-align: center;
    font-size: 14pt !important;
    font-weight: bold;
    padding: 6px;
}

.VSpace5 {
    margin-top: 5px;
    margin-bottom: 5px;
}

.VSpace10 {
    margin-top: 10px;
    margin-bottom: 10px;
}

.VSpace15 {
    margin-top: 15px;
    margin-bottom: 15px;
}

div.Hotlink_Bar {
    position: fixed;
    top: 150px;
    left: 10px;
    text-align: center;
    width: 120px;
    background-color: white;
}

div.Hotlink_Bar160 {
    position: fixed;
    top: 250px;
    left: 10px;
    text-align: center;
    width: 160px;
    background-color: white;
}

a.Hotlink {
    display: inline-block;
    border: 2px outset black;
    background-color: #d0d0d0;
    color: #000099;
    font-weight: bold;
    font-size: 11pt;
    width: 18px;
    height: 18px;
    padding: 2px;
    text-align: center;
    vertical-align: middle;
    margin: 5px;
    text-decoration: none;
}

    a.Hotlink:hover {
        background-color: #fffff0;
    }

a.Anchor {
    display: block;
    position: relative;
    top: -170px;
    visibility: hidden;
}

a.Anchor2 {
    display: block;
    position: relative;
    top: -220px;
    visibility: hidden;
}

a.Black {
    color: black;
    text-decoration: none;
    font-weight: bold;
    cursor: pointer;
}

    a.Black:hover {
        color: blue;
    }

a.White {
    font-weight: bold;
    color: white;
    text-decoration: none;
    cursor: pointer;
}

    a.White:hover {
        color: yellow;
        cursor: pointer;
    }

a.Red {
    color: #aa0000;
    text-decoration: none;
    font-weight: bold;
    cursor: pointer;
}

    a.Red:hover {
        color: #ff0000;
    }

img.Report {
    width: 93px;
    height: 15px;
    cursor: pointer;
    margin-right: 4px;
    vertical-align: bottom;
}

img.Border {
    border: 1px solid black;
}

.Big {
    font-size: 14pt;
}

.Small {
    font-size: 8pt;
}

input.ChkBox {
    width: 13px;
    height: 13px;
    vertical-align: bottom;
}

input.Radio {
    width: 13px;
    height: 13px;
    vertical-align: bottom;
}

/* Buttons ***********************************************************/
input.BtnRow {
    padding: 1px 7px;
    font-size: 10pt !important;
    margin: 5px 20px !important;
}

input.BtnRowL {
    padding: 1px 7px;
    font-size: 10pt !important;
    margin: 10px 25px !important;
    box-sizing: content-box;
    min-width: 100px;
}

input.BtnCDS {
    font-size: 10pt !important;
    padding: 3px 15px !important;
    margin: 4px !important;
}

input.Btn10 {
    font-size: 10pt !important;
    padding: 3px 10px !important;
    margin: 4px !important;
}

input.BtnRed {
    color: #aa0000 !important;
    font-size: 10pt !important;
    padding: 3px 15px !important;
    margin: 4px !important;
}

input.BtnBlue {
    color: #0000bb !important;
    font-size: 10pt !important;
    padding: 3px 15px !important;
    margin: 4px !important;
}

input.BtnGreen {
    color: #00aa00 !important;
    font-size: 10pt !important;
    padding: 3px 15px !important;
    margin: 4px !important;
}

input.BtnLarge {
    padding: 4px 8px !important;
    font-size: 11pt !important;
    margin: 3px !important;
}

input.Btn {
    padding-left: 4px !important;
    padding-right: 4px !important;
    font-size: 9pt !important;
}

input.BtnCDS2 {
    font-size: 9pt !important;
    margin: 3px !important;
}

input.BtnThick {
    font-size: 10pt !important;
    margin: 3px !important;
    width: 90px !important;
}

input.BtnSmall {
    font-size: 9pt !important;
}

input.BtnSpaced {
    font-size: 9pt !important;
    margin: 3px !important;
    width: 135px;
}

    input.BtnSpaced:hover {
        box-shadow: inset 0 0 3px rgba(20, 240, 250, 0.50) !important;
    }

button.BtnSpaced {
    font-size: 9pt !important;
    margin: 3px !important;
    width: 135px;
}

    button.BtnSpaced:hover {
        box-shadow: inset 0 0 3px rgba(20, 240, 250, 0.50) !important;
    }

input.BtnSpacedW {
    font-size: 9.5pt !important;
    margin: 3px !important;
}

    input.BtnSpacedW:hover {
        box-shadow: inset 0 0 3px rgba(20, 240, 250, 0.50) !important;
    }

input.BtnSpaced160 {
    font-size: 9pt !important;
    margin: 3px !important;
    min-width: 160px;
}

    input.BtnSpaced160:hover {
        box-shadow: inset 0 0 3px rgba(20, 240, 250, 0.50) !important;
    }

button.BtnSpacedW {
    font-size: 9.5pt !important;
    margin: 3px !important;
}

    button.BtnSpacedW:hover {
        box-shadow: inset 0 0 3px rgba(20, 240, 250, 0.50) !important;
    }

input.BtnSpacedL {
    font-size: 9.5pt !important;
    margin: 3px !important;
    min-width: 135px;
}

input.BtnBig {
    padding: 3px 20px;
    font-size: 12pt;
    font-weight: bold;
}

input.BtnSpacedL:hover {
    box-shadow: inset 0 0 3px rgba(20, 240, 250, 0.50) !important;
}

input.BtnSpacedS {
    font-size: 9.5pt !important;
    width: 90px;
    padding: 0 !important;
}

    input.BtnSpacedS:hover {
        box-shadow: inset 0 0 3px rgba(20, 240, 250, 0.50) !important;
    }

button.BtnSpacedS {
    font-size: 9pt !important;
    width: 90px;
    padding: 0 !important;
}

button.BtnSpaced:hover {
    box-shadow: inset 0 0 3px rgba(20, 240, 250, 0.50) !important;
}

input.BtnSpacedT {
    font-size: 9pt;
    width: 70px;
    padding: 0 !important;
}

    input.BtnSpacedT:hover {
        box-shadow: inset 0 0 3px rgba(20, 240, 250, 0.50) !important;
    }

button.BtnSpacedT {
    font-size: 9.5pt !important;
    width: 70px;
    padding: 0 !important;
}

    button.BtnSpacedT:hover {
        box-shadow: inset 0 0 3px rgba(20, 240, 250, 0.50) !important;
    }

input.Btn10F {
    font-size: 10pt;
    margin: 3px !important;
    min-width: 165px;
}

    input.Btn10F:hover {
        box-shadow: inset 0 0 3px rgba(20, 240, 250, 0.50) !important;
    }

input.BtnCDS_Small {
    font-size: 8pt;
    padding-left: 4px !important;
    padding-right: 4px !important;
}

    input.BtnCDS_Small:hover {
        box-shadow: inset 0 0 3px rgba(20, 240, 250, 0.50) !important;
    }

/* End Buttons ***********************************************************/

input.Strong {
    font-weight: bold;
    font-size: 10pt;
    border: 2px solid black !important;
}

input.Number {
    text-align: right;
}

input.Number80 {
    text-align: right;
    width: 80px;
}

.Bold {
    font-weight: bold;
}

h1 {
    padding: 0;
    margin: 0;
    font-family: Raleway;
    font-weight: bold;
    font-size: 20pt;
    color: #202f8a;
}

h2 {
    padding: 0;
    margin: 0;
    font-weight: bold;
    font-size: 16pt;
}

h3 {
    padding: 0;
    margin: 0;
    font-weight: bold;
    font-size: 14pt;
}

h4 {
    padding: 0;
    margin: 0;
    font-weight: bold;
    font-size: 12pt;
}

div.Page_Title {
    text-align: center;
    padding: 6px;
    color: #000000;
    white-space: nowrap;
    margin-bottom: 15px;
    break-after: avoid;
}

.TitleS {
    font-size: 10pt;
    text-align: center;
    padding: 1px;
    font-weight: bold;
    color: #000000;
    white-space: nowrap;
}

.CLink {
    text-align: center;
    padding: 10px;
}

.Tab {
    padding-left: 15px;
}

.HiLite {
    background-color: #ffffaa;
}

.Confidential {
    font-style: italic;
    color: #ff0000;
    font-weight: bold;
}

.InactiveNote {
    font-weight: bold;
    font-style: italic;
    color: #cc0000 !important;
    padding: 3px;
}

.Inactive {
    background-color: #dddddd !important;
}

span.Err {
    margin: 4px;
    background: yellow;
    font-weight: bold;
    font-size: 11pt;
    color: #dd0000;
    padding: 4px;
    border: solid 1px #dd0000;
}

div.Err {
    background: #f6fa75;
    font-weight: bold;
    font-size: 9pt;
    color: #dd0000;
    padding: 2px;
}

span.Error {
    font-weight: bold;
    font-size: 10pt;
    color: #cc0000;
    background-color: #ffff99;
    font-style: italic;
}

span.Note {
    font-weight: bold;
    font-style: italic;
    color: #cc0000;
    font-size: 9pt;
}

div.NoteF {
    font-size: 9pt;
    font-weight: bold;
    font-style: italic;
    padding-top: 6px;
    padding-left: 6px;
    color: black !important;
}

div.Note {
    color: #cc0000;
    font-weight: bold;
    font-size: 9.5pt;
    text-align: center;
}

div.RedNote {
    color: #cc0000;
    text-align: left;
    font-size: 9.5pt;
    font-weight: bold;
    padding: 5px;
}

div.BlueNote {
    color: #0000ee;
    font-weight: bold;
    font-size: 9.5pt;
    text-align: left;
    padding: 5px;
}

div.GreenNote {
    color: #00aa00;
    font-weight: bold;
    font-size: 9.5pt;
    text-align: left;
    padding: 5px;
}

div.TopNote {
    font-weight: bold;
    color: #cc0000;
    font-size: 9pt;
    text-align: center;
    padding: 10px;
}

div.NoteI {
    font-weight: bold;
    font-style: italic;
    color: #cc0000;
    font-size: 9pt;
    text-align: center;
}

div.NoteS {
    font-weight: bold;
    color: #cc0000;
    font-size: 8pt;
    text-align: center;
}

div.Inactive {
    font-size: 9pt;
    color: #cc0000;
    font-style: italic;
    font-weight: bold;
}

div.Print { /* This is used when you want the whole contents to print on a seperate page. DO NOT try in embed this in a table, or it probably won't work! */
    break-before: page;
    break-inside: avoid;
    text-align: center;
}

.Header {
    text-align: center;
    font-weight: bold;
    font-size: 11pt;
    padding: 15px;
}

.Header20 {
    text-align: center;
    font-weight: bold;
    font-size: 11pt;
    padding-bottom: 20px;
}

div.Confirmation {
    text-align: center;
    font-weight: bold;
    font-size: 12pt;
    padding: 30px;
}

div.Problem {
    text-align: left;
    font-weight: bold;
    font-size: 9pt;
    color: #cc0000;
    background-color: #ffff99;
    font-style: italic;
}

div.Err_Table {
    display: table;
    margin: 3px;
}

div.Error {
    text-align: left;
    font-weight: bold;
    font-size: 10pt;
    color: #cc0000;
    display: table-cell;
    background-color: #ffff77;
    padding: 3px 8px;
}

div.ErrCNB {
    text-align: center;
    font-weight: bold;
    font-size: 10pt;
    color: #cc0000;
    padding: 20px;
}

div.ErrSlim /* Used for siplaying an error inside of a table after the form control */ {
    display: flex;
    margin: 2px;
    max-width: 700px;
    background: yellow;
    font-size: 10pt;
    font-weight: bold;
    color: #cc0000;
    padding: 2px 7px;
    border-radius: 4px;
}

/* These classes are only used for message boxes ******************************************************************/

div.Msg /* Msg_Box() */ {
    text-align: center;
    display: inline-flex;
    max-width: 700px;
    margin: 5px auto;
    padding: 4px 15px;
    font-size: 10pt;
    font-weight: bold;
    font-family: Roboto, Arial, sans-serif;
    border-radius: 15px;
    background-color: #e7e1b8; /* Backup color if an older browser doesn't handle the gradient code below */
    background-image: linear-gradient(to bottom,#f8f2c9 0%, #ead599 100%); /* The shade is a faded ivory gradient */
    color: #0000cc !important; /* blue */
}

div.Info_Msg /* Msg_Info() */ {
    text-align: center;
    display: inline-flex;
    max-width: 700px;
    margin: 5px auto;
    padding: 4px 15px;
    font-size: 10pt;
    font-weight: bold;
    font-family: Roboto, Arial, sans-serif;
    border-radius: 15px;
    background-color: #65b4eb; /* Backup color if an older browser doesn't handle the gradient code below */
    background-image: linear-gradient(to bottom, #54a3da 0%, #0b35a5 100%); /* The shade is a faded blue gradient */
    color: #ffffff !important;
}

div.Success_Msg /* Msg_Success() */ {
    text-align: center;
    display: inline-flex;
    max-width: 700px;
    margin: 5px auto;
    padding: 4px 15px;
    font-size: 10pt;
    font-weight: bold;
    font-family: Roboto, Arial, sans-serif;
    border-radius: 15px;
    background-image: linear-gradient(to bottom,#aafcb6 0%,#7dc484 100%); /* The shade is a faded light green gradient */
    color: #000000 !important; /* black */
}

div.Err_Msg /* Msg_Error() */ {
    text-align: center;
    display: inline-flex;
    max-width: 700px;
    margin: 5px auto;
    padding: 5px 15px;
    font-size: 10pt;
    font-weight: bold;
    font-family: Roboto, Arial, sans-serif;
    border-radius: 15px;
    background-color: #fefe60;
    background-image: linear-gradient(to bottom, #fefe60 0%, #ecee1a 100%); /* The shade is a faded light yellow gradient */
    color: #cc0000 !important; /* red */
}

/* End of message box classes ****************************************************************************************/

div.NoRecs {
    display: table;
    margin: 5px auto;
    font-size: 11pt;
    font-weight: bold;
    color: #dd0000;
    padding: 10px 7px;
    border: solid 1px #dd0000;
    border-radius: 15px;
}

div#divLoading {
    position: fixed;
    padding: 10px;
    top: 47%;
    left: 48%;
    z-index: 100;
}

select.Small {
    font-weight: bold;
    font-size: 8pt;
    color: #000000;
    background-color: #ffffdd;
}

.Field {
    font-weight: bold;
    background-color: #ffffdd;
    font-size: 10pt;
}

.Field_Err {
    font-weight: bold;
    background-color: #ffff77;
    font-size: 10pt;
}

.Required {
    font-weight: bold;
    color: #cc0000;
}

.Normal {
    font-weight: normal;
}

.Click {
    cursor: pointer;
    text-decoration: underline;
    font-weight: bold;
    color: #0000cc;
}

.Link {
    cursor: pointer;
    text-decoration: underline;
    color: blue;
}

.CDSLink {
    cursor: pointer;
    text-decoration: underline;
}

    .CDSLink:hover {
        background-color: #f7f877;
    }

a.Bold {
    font-size: 11pt;
    font-weight: bold;
    cursor: pointer;
    text-decoration: underline;
    margin: 8px;
}

div.BtnCarmody {
    color: #000000;
    text-align: center;
    background-color: #ffffbb;
    font-size: 9pt;
    font-weight: bolder;
    border: 1px outset #777777;
    height: 14px;
    width: 100px;
    margin: 5px auto;
    padding: 3px 5px;
}

a.Btn {
    color: #000099;
    background-color: #dddddd;
    border: 2px outset #222222;
    font-size: 8pt;
    font-weight: bold;
    padding: 0px 3px 0px 3px;
    margin: 3px;
    text-decoration: none;
}

a.BtnRow {
    cursor: pointer;
    color: #000000 !important;
    font-weight: normal;
    font-family: Button, Tahoma, sans-serif;
    font-size: 10pt;
    border: 2px outset #dddddd;
    background-image: linear-gradient(to bottom, #f0f0f0 0%,#cccccc 100%);
    margin: 5px 20px !important;
    padding: 1px 6px;
    text-decoration: none;
}

span.Btn {
    color: #000099;
    background-color: #dddddd;
    border: 2px outset #222222;
    font-size: 8pt;
    font-weight: bold;
    padding: 0px 3px 0px 3px;
    margin: 3px;
    text-decoration: none;
    cursor: pointer;
}

a.Btn:hover {
    border: 2px inset #555555;
}

.Mock_Button {
    color: #000099;
    border: 2px outset #000099;
    font-size: 10pt;
    font-weight: bold;
    padding: 2px;
    margin: 1px;
    background-color: #ddddee;
    text-decoration: none;
    cursor: pointer;
}

.Mock_Btn_Selected {
    color: #000099;
    border: 2px outset #000099;
    font-size: 10pt;
    font-weight: bold;
    padding: 2px;
    margin: 1px;
    background-color: #ffff88;
    text-decoration: none;
    cursor: pointer;
}

.Btn_Small {
    color: #000099;
    border: 2px outset #5555FF;
    font-size: 10pt;
    font-weight: bold;
    padding: 0px 2px 0px 2px;
    background-color: #ddddff;
    cursor: pointer;
}

.NoData {
    font-weight: bold;
    font-size: 12pt;
    color: #cc0000;
    border: solid 1px #cc0000;
    background-color: #ffffff;
    max-width: 500px;
    text-align: center;
    margin-left: auto;
    margin-right: auto;
}

.Alert {
    font-size: 10pt;
    font-weight: bold;
    color: #cc0000;
    background-color: #ffff99;
    padding: 2px;
    white-space: nowrap;
}

.NoBorder {
    border-style: none;
}

.cText {
    color: black;
    font-size: 8pt;
    font-weight: bold;
    background-color: white;
}

input.radBlack {
    background-color: white;
    width: 15px;
    height: 15px;
}

input.radYellow {
    background-color: #ffff99;
    width: 15px;
    height: 15px;
}

input.chkBlack {
    background-color: white;
    width: 15px;
    height: 15px;
}

input.chkYellow {
    background-color: #ffff99;
    width: 15px;
    height: 15px;
}

div.Table {
    display: table;
    margin: 10px auto;
}

div.Alert_Link {
    cursor: pointer;
    color: #cc0000;
    text-align: center;
    font-size: 9pt;
    font-weight: bold;
    text-decoration: underline;
    padding: 3px;
}

    div.Alert_Link:hover {
        color: #ff0000;
    }

div.tr {
    display: table-row;
}

div.dataL {
    display: table-cell;
    text-align: left;
}

div.dataR {
    display: table-cell;
    text-align: right;
}

div.dataC {
    display: table-cell;
    text-align: center;
}

/* Used for Service_Reports.aspx for the printable blank form. */
div.Checkbox {
    display: inline-block;
    margin: 2px 5px 0 5px;
    border: 1px solid black;
    width: 10px;
    height: 10px;
    text-align: center;
    padding: 0 2px 8px 2px;
    vertical-align: text-bottom;
    font-size: 9pt;
    font-weight: bold;
    font-family: 'Arial Black', 'Arial Bold', Gadget, sans-serif;
}

div.TextBox {
    display: inline-block;
    margin-bottom: 5px;
    border-bottom: 1px solid black;
    width: 95%;
    height: 15px;
}

div.TextArea {
    display: inline-block;
    margin-bottom: 5px;
    border: 1px solid black;
    width: 95%;
    vertical-align: top;
    text-align: left;
    padding: 4px;
}

.Center_NB {
    border-style: none;
    padding: 10px;
    text-align: center;
}

.RB_Right {
    border-right-style: none;
}

.RB_Left {
    border-left-style: none;
}

input.Error {
    background-color: #ffff99;
}

select.Error {
    background-color: #ffff99;
}

textarea.Error {
    background-color: #ffff99;
}

div.List {
    text-align: left;
    padding: 5px;
    font-weight: bold;
}

div.ListC {
    text-align: center;
    padding: 5px;
    font-weight: bold;
}

.LWrap {
    white-space: nowrap;
    text-align: left;
}

div.HoverBox {
    position: absolute;
    z-index: 100;
    display: block;
    margin: 5px 0;
    overflow: hidden;
    border: 1px solid #dddddd;
    box-shadow: 1px 1px 4px rgba(0, 0, 0, .5);
    background-color: white;
    font-size: 10pt;
    height: 1.1em;
    list-style: none;
    padding: 3px;
    cursor: pointer;
}

    div.HoverBox:hover {
        height: auto;
    }

div.HoverTitle {
    vertical-align: middle;
    text-align: center;
    color: #000000;
    font-size: 10pt;
    font-weight: bold;
    padding: 3px;
    background: #dddddd;
}

#divHoverBox {
    border: 2px solid #999999;
    margin: 10px auto;
    padding: 0;
    height: 4em; /* If you change this value, it must also be changed in inc_pump_entry.js fShow_Prop() */
    overflow: hidden;
    background-color: white;
    font-size: 10pt;
    cursor: pointer;
}

    #divHoverBox:hover {
        height: auto;
    }

img.HoverBox {
    float: right;
    border-style: none;
    cursor: pointer;
}

div.Footer {
    margin-top: 35px;
    margin-bottom: 15px;
    text-align: center;
    padding: 5px;
    font-size: 9pt;
    overflow: auto;
}

div.Disclaimer {
    text-align: justify;
    margin: 0 auto 20px auto;
    max-width: 1000px;
    font-size: 10pt;
    font-weight: normal;
    color: black;
}

a.PDF_Link {
    font-weight: bold;
    font-size: 9pt;
    color: blue;
    margin: 3px 20px;
}

    a.PDF_Link:hover {
        color: #cc0000;
        font-size: 10pt;
    }

div.CBar {
    text-align: center;
    padding: 15px 0;
}

.Info {
    color: #009900;
    background-color: transparent;
}

/* Used by the JQuery autocomplete function ************************************************************/
.autocomplete-w1 {
    background: url('/JSLibraries/shadow.png') no-repeat;
    background-position: bottom right;
    position: absolute;
    top: 0px;
    left: 0px;
    margin: 0;
}

.autocomplete {
    border: 1px solid #999;
    background: #FFF;
    cursor: default;
    text-align: left;
    max-height: 350px;
    height: 350px;
    margin: 0;
    overflow-x: hidden;
}

    .autocomplete .selected {
        background: #F0F0F0;
    }

    .autocomplete div {
        padding: 2px 5px;
        white-space: nowrap;
    }

    .autocomplete strong {
        font-weight: normal;
        color: #3399FF;
    }

/* Scrolling ************************************************ */

thead.TScroll {
    position: sticky;
    top: 0;
    z-index: 1;
    background: #cccccc;
}

th.TScroll {
    position: sticky;
    top: 0;
    z-index: 1;
}

.TScroll100 {
    margin: 0 auto;
    max-height: 100px; /* Limits the height of visible rows */
    overflow-y: auto; /* Adds vertical scrollbar when contents overflow */
    border: 1px solid #aaaaaa;
}

.TScroll200 {
    margin: 0 auto;
    max-height: 200px; /* Limits the height of visible rows */
    overflow-y: auto; /* Adds vertical scrollbar when contents overflow */
    border: 1px solid #aaaaaa;
}

/* End of Scrolling */