/* Minification failed. Returning unminified contents.
(11,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(12,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(13,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(14,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(15,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(27,24): run-time error CSS1039: Token not allowed after unary operator: '-nimble-blue'
(31,32): run-time error CSS1039: Token not allowed after unary operator: '-nimble-blue'
(37,24): run-time error CSS1039: Token not allowed after unary operator: '-nimble-teal'
(41,32): run-time error CSS1039: Token not allowed after unary operator: '-nimble-teal'
(47,24): run-time error CSS1039: Token not allowed after unary operator: '-nimble-green'
(51,32): run-time error CSS1039: Token not allowed after unary operator: '-nimble-green'
(57,24): run-time error CSS1039: Token not allowed after unary operator: '-nimble-yellow'
(61,32): run-time error CSS1039: Token not allowed after unary operator: '-nimble-yellow'
 */
/*  PrecisionPortal */
.mainHeaderCover {
    background-color: #016aa8 !important;
}

.subHeaderCover {
    background-color: #3AA29F !important;
}

:root {
    --nimble-navy: #1B2833;
    --nimble-yellow: #f2c819;
    --nimble-blue: #016aa8;
    --nimble-green: #75D58F;
    --nimble-teal: #3AA29F;
}

.dashboardCard {
    height: 270px !important;
    border-width: 4px !important;
    transition: background-color 0.2s ease-in-out !important;
    border-radius: 10px !important;
    box-shadow: 0 4px 10px rgba(0,0,0,0.16), 0 4px 10px rgba(0,0,0,0.23) !important;
}

.nimbleBlueCard {
    border-color: var(--nimble-blue) !important;
}

    .nimbleBlueCard:hover {
        background-color: var(--nimble-blue);
        cursor: pointer;
        color: white;
    }

.nimbleTealCard {
    border-color: var(--nimble-teal) !important;
}

    .nimbleTealCard:hover {
        background-color: var(--nimble-teal);
        cursor: pointer;
        color: white;
    }

.nimbleGreenCard {
    border-color: var(--nimble-green) !important;
}

    .nimbleGreenCard:hover {
        background-color: var(--nimble-green);
        cursor: pointer;
        color: white;
    }

.nimbleYellowCard {
    border-color: var(--nimble-yellow) !important;
}

    .nimbleYellowCard:hover {
        background-color: var(--nimble-yellow);
        cursor: pointer;
        color: white;
    }

.nimbleRedCard {
    border-color: indianred !important;
}

    .nimbleRedCard:hover {
        background-color: indianred;
        cursor: pointer;
        color: white;
    }


/*  The new nimble fonts */
@font-face {
    font-family: Adelle;
    src: url(fonts/adelle_reg.otf);
    font-weight: normal;
}

@font-face {
    font-family: Adelle;
    src: url(fonts/adelle_bold.otf);
    font-weight: bold;
}

@font-face {
    font-family: Adelle;
    src: url(fonts/adelle_italic.otf);
    font-weight: normal;
    font-style: italic;
}

@font-face {
    font-family: Adelle;
    src: url(fonts/adelle_bolditalic.otf);
    font-weight: bold;
    font-style: italic;
}

@font-face {
    font-family: SofiaPro;
    src: url(fonts/sofiaproregular.woff2);
    font-weight: normal;
}

@font-face {
    font-family: SofiaPro;
    src: url(fonts/sofiaprobold.woff2);
    font-weight: bold;
}

@font-face {
    font-family: SofiaPro;
    src: url(fonts/sofiaproregular-italic.woff2);
    font-weight: normal;
    font-style: italic;
}

@font-face {
    font-family: SofiaPro;
    src: url(fonts/sofiaprobold-italic.woff2);
    font-weight: bold;
    font-style: italic;
}

html, body, form {
    margin: 0;
    padding: 0;
    height: 100%;
    font-family: "Segoe UI", Helvetica, Arial, "Arial Unicode MS", Sans-Serif;
}

input[type=checkbox] {
    width: auto !important;
    height: auto !important;
    border: none !important;
    background: transparent !important;
    margin-top: 1px;
    padding-top: 1px;
}

option {
    margin: 0;
    padding: -20px 0.5em 0 0;
}

div.ui-datepicker {
    font-size: 10px;
}

img {
    margin: 0;
    padding: 0;
    border: none;
}

input {
    overflow: visible; /* AAAGGGGGHHHHHH This is required for IE7 to respect my padding authoritie in input submits */
}

.red {
    color: Red;
}

a {
    color: Navy;
}

    a.lighter {
        color: Yellow;
    }

    a:hover {
        color: Red;
        text-decoration: underline;
    }

    a.tinycopier {
        display: block;
        width: 16px;
        height: 16px;
        background: url(images/page_copy.png) 0 0 no-repeat;
    }

        a.tinycopier:hover {
            background: url(images/page_white_copy.png) 0 -0px no-repeat;
        }


.ellipsis {
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
}


/* used to make invisible things that cannot be set to display:none */
.goaway {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    height: 0;
    width: 0;
    z-index: 0;
    margin: 0;
    padding: 0;
    border: none;
    overflow: hidden;
    display: inline;
}

body.bluebackground {
    margin: 0;
    padding: 0;
    background-color: #E5ECF3;
    background-image: url(/images/clouds1.png);
}

div.clear {
    width: 100%;
    height: 1px;
    margin: 0 0 -1px 0;
    padding: 0;
    border: none;
    clear: both;
}

/* these are set up to allow site to scale from 800 width to 1280 width */
div.innerbak {
    background-color: White;
    min-width: 758px; /* 800 px - 2x1 body margins - 2x5 my padding - 20 scrollbar - 10 browser frame = 758 */
    /*max-width: 1238px;*/
    overflow: hidden;
    width: auto;
    padding: 0px 5px 0px 5px;
    min-height: 100%;
    margin: 0 auto -25px;
}


/* these are set up to allow site to scale from 800 width to 1280 width */
/* used when footer is hidden */
div.innerbaknofooter {
    background-color: White;
    min-width: 758px; /* 800 px - 2x1 body margins - 2x5 my padding - 20 scrollbar - 10 browser frame = 758 */
    /*max-width: 1238px;*/
    overflow: hidden;
    width: auto;
    padding: 0px 5px 0px 5px;
    min-height: 100%;
    /*height: 100vh;*/
    margin: 0 auto 0px;
}

/* these are set up to allow site to scale from 800 width to 1280 width */
div.innerfooter {
    min-width: 758px; /* 800 px - 2x1 body margins - 2x5 my padding - 20 scrollbar - 10 browser frame = 758 */
    /*max-width: 1238px;*/
    background-color: #1D2C38;
    /*background-image: url(/images/footerbg_navy.png);*/
    background-image: url(/images/footerbg_nimbleblue.png);
    background-repeat: repeat-x;
    overflow: hidden;
    width: auto;
    margin: 5px auto 0;
    padding: 0px 5px 0px 5px;
    font-weight: bold;
    font-size: 11px;
    color: White;
    height: 20px;
}

/* push goes right before the end of innerbak - should be footer height.  Pushes footer to bottom.  */
div.push {
    height: 25px;
    clear: both;
}

div.pushnofooter {
    height: 0px;
    clear: both;
}

div.outerbak {
    background-color: White; /* these are set up to allow site to scale from 800 width to 1280 width */ /*    width:987px;    /* 1024 px - 2x1 body margins - 2x5 my padding - 20 scrollbar - 10 browser frame = 982 */
    width: 1000px;
    overflow: hidden;
    padding: 0px 0px 0px 0px;
    min-height: 100%;
    margin: 0 auto -51px;
}


div.toolbar {
    /*background-color: #1D2C38;*/
    /*background-image: url(/images/toolbarbg_navy.png);*/
    background-color: #016AA8;
    background-image: url(/images/toolbarbg_nimbleblue.png);
    background-repeat: repeat-x;
    overflow: hidden;
    padding: 0 5px 0 5px;
    border-radius: 8px;
}

.useridblock {
    overflow: hidden;
    text-align: right;
    vertical-align: middle;
    font-weight: normal;
    font-size: 10px;
    line-height: 11px;
    color: White;
    width: 150px;
    margin-top: 3px;
    text-decoration: none;
}

a.useridblock:hover {
    color: White;
}



/* a good wrapper for things, makes them centered. */
div.centereddiv {
    width: 100%;
    margin: 0 auto;
    text-align: center;
}

/* designed to take up the width of a screen at 800x600, minus wrappers */
div.pagewidth {
    width: 748px;
    margin: 0 auto;
    overflow: hidden;
}


div.hscroll {
    overflow-x: auto;
}

div.filtercover,
div.filtercover-wide,
div.filtercover-narrow {
    background-image: url(/images/2partgradient_nimblenavy.png);
    background-color: #D2D5D6;
/*    background-image: url(/images/2partgradient_nimblegreendk.png);
    background-color: #B6E4C2;*/
    background-repeat: repeat-x;
    margin: 0 auto;
    border-radius: 6px;
    padding: 2px;
    overflow: hidden;
}

div.filtercover {
    width: 748px;
}

div.filtercover-wide {
    width: 964px;
}

div.filtercover-narrow {
    width: 374px;
}

div.searchresultscover,
div.subsearchresultscover {
    width: auto;
    border-radius: 6px;
    overflow: auto;
    background-image: url(/images/2partgradient_nimblenavy.png);
    background-repeat: repeat-x;
    background-color: #D2D5D6;
}

div.searchresultscover {
    margin: 4px 0 0 0;
    padding: 2px 2px 2px 2px;
}

/* for use in a maincover */
div.subsearchresultscover {
    /* These pull it in so when inside a maincover they do not have any maincover padding around them */
    margin: 3px -2px 1px -2px;
    padding: 2px 3px 2px 3px;
}


div.mainitemcover,
div.mainitemcover-wide,
div.mainitemcover-max,
div.subtabcover,
div.faxviewcover,
div.subcover {
    border-radius: 6px;
    overflow: visible;
    background-image: url(/images/2partgradient_nimblenavy.png);
    background-repeat: repeat-x;
    background-color: #D2D5D6;
    padding: 2px 2px 2px 2px;
}

div.mainitemcover,
div.faxviewcover {
    width: 740px;
}

div.mainitemcover-wide {
    width: 964px;
}

div.mainitemcover,
div.mainitemcover-wide,
div.faxviewcover,
div.subtabcover {
    margin: 0 auto;
}

div.faxviewcover {
    margin-top: 4px;
    text-align: center;
    min-height: 100px;
    overflow: hidden;
}

/* Used inside a maincover */
div.subcover {
    /* These pull it in so when inside a maincover they do not have any maincover padding around them */
    margin: 2px -2px -2px -2px;
    padding: 2px 2px 2px 2px;
}

/* this goes inside a tab cover which has a border on left and right sides */
div.subtabcover {
    padding: 2px 0 2px 0;
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
}

div.doceditorfieldsback {
    background-color: Transparent;
    width: auto;
}

.faxsubmitpanel {
    height: 500px;
}


/* used in popup forms */
div.subformcover,
div.subformwidecover {
    /*background-image: url(/images/2partgradient_nimblenavy.png);
    background-repeat: repeat-x;
    background-color: #D2D5D6;
    width: 372px;*/
    margin: 0 auto;
    border-radius: 6px;
    padding: 2px;
    overflow: visible;
    z-index: 6001 !important; /* Bug in Ajax controlkit 15.1.4 causes z-index problem, this fixes it.  May be able to remove in later versions.  */
}

div.subformwidecover {
    width: 740px;
}

div.clientbadge,
div.cbdisabled,
div.cbtrial,
div.cberror {
    display: inline-block;
    *zoom: 1;
    /*	width:120px;    */
    background-color: #EFEFEF;
    color: Black;
    margin: 0 auto;
    border-radius: 6px;
    padding: 2px 4px 2px 4px;
    overflow: hidden;
    text-align: left;
    white-space: nowrap;
    font-size: 11px;
    line-height: 15px;
    font-weight: normal;
    text-decoration: none;
}

div.cbdisabled {
    background-color: #FF7C7C;
}

div.cbtrial {
    background-color: Yellow;
}

div.cberror {
    background-color: Gray;
    color: White;
}

span.clientbadge,
span.clientid,
span.cbcsrep,
span.cbsrep,
span.cbzone,
span.cbmtu,
span.cbnsb,
span.cbhmsy,
span.cbhmsn {
    padding-top: 6px;
    text-align: left;
    white-space: nowrap;
    font-size: 14px; /*11px;*/
    line-height: 15px;
    font-weight: bold; /*normal;*/
    text-decoration: none;
    color: Black;
    display: inline-block;
}

span.clientid {
    color: Black;
}

span.cbcsrep {
    color: #7C0187;
}

span.cbsrep {
    color: Navy;
}

span.cbzone {
    color: Blue;
}

span.cbmtu {
    color: Green;
}

span.cbnsb {
    color: Magenta;
}

span.cbhmsy {
    color: forestgreen;
}

span.cbhmsn {
    color: indianred;
}


/* empty invisible table for laying things out */
.invisibletable {
    border-style: none;
    border-collapse: collapse;
    border-spacing: 0;
    border-width: 0;
    padding: 0;
    margin: 0;
}

.nicetable {
    vertical-align: top;
    text-align: left;
    padding-left: 2px;
    overflow: hidden;
    word-wrap: break-word;
    overflow-wrap: break-word;
}

.wrapme {
    vertical-align: top;
    overflow-wrap: break-word;
    word-break: break-word;
}


/****************************************/
/* grid                                 */
/****************************************/

.medtekgrid {
    border: none;
    border-collapse: collapse;
    text-align: left;
    color: Black;
    font-weight: normal;
    font-size: 12px;
    text-decoration: none;
    vertical-align: top;
    background-color: Transparent;
}

table.medtekgrid td {
    padding: 1px 2px 0px 2px;
}

/* used in the header labels */
.gridheaderspan {
    white-space: nowrap;
}


.medtekgridheader {
    color: #12364C;
    white-space: nowrap;
    text-align: left;
    background-color: #D2D5D6;
    font-weight: normal;
    font-size: 11px;
}

.medtekgridheadertrans {
    /*color: #12364C;
    white-space: nowrap;
    background-color: Transparent;
    font-weight: normal;
    font-size: 11px;*/

    color: #12364C;
    white-space: nowrap;
    font-weight: bolder;
    font-size: 16px;
}

    .medtekgridheadertrans select {
        height: 16px;
        font-size: 11px;
    }

.medtekgridpager {
    color: #12364C;
    white-space: nowrap;
    background-color: #D2D5D6;
    font-weight: normal;
    font-size: 11px;
}

.medtekgridpagertrans {
    /*color: #12364C;
    white-space: nowrap;
    background-color: Transparent;
    font-weight: normal;
    font-size: 11px;
    line-height: 14px;*/

    color: #12364C;
    white-space: nowrap;
    background-color: black;
    font-weight: normal;
    font-size: 14px;
    line-height: 20px;
}

    .medtekgridpagertrans select {
        height: 17px;
        font-size: 10px;
        line-height: 14px;
    }

.medtekgridfooter {
    color: #12364C;
    white-space: nowrap;
    background-color: #D2D5D6;
    font-weight: normal;
    font-size: 11px;
}


.medtekgrid select,
select.medtekgrid,
.medtekgrid input,
input.medtekgrid,
.medtekgrid textarea
textarea.medtekgrid {
    font-size: 11px;
    line-height: 14px;
}

.medtekgrid select,
select.medtekgrid {
    height: 18px; /* for some reason the select height includes borders & padding */
    padding: 0;
}

.medtekgrid input,
input.medtekgrid {
    height: 14px; /* but input uses proper box model */
}

    /* may have to do these like checkboxes */

    input[type=file].medtekgrid,
    .medtekgrid input[type=file] {
        height: 15px;
        border: solid 1px gray;
    }

input.medtekgrid,
select.medtekgrid,
textarea.medtekgrid,
.medtekgrid input,
.medtekgrid select,
.medtekgrid textarea {
    background-color: White;
    font-weight: normal;
    border: solid 1px gray;
}

/* IE6 does not support type selectors so we need to apply "medtekgridcheck" to checkboxes to style the boxes themselves. 
	
*/
.medtekgridcheck input,
input.medtekgridcheck {
    width: auto !important;
    height: auto !important;
    border: none !important;
    background: transparent !important;
    margin-top: 1px;
    padding-top: 1px;
}

/* for the labels next to the checkboxes */
label.medtekgrid,
.medtekgrid label {
    margin-left: 4px;
    font-size: 11px;
    line-height: 15px;
    font-weight: normal;
    text-decoration: none;
    vertical-align: top;
    color: #12364C;
}


input.medtekgrid:focus,
select.medtekgrid:focus,
.medtekgrid input:focus,
.medtekgrid select:focus {
    background-color: #ffff90;
    font-weight: normal;
}


.medtekgridrowtrans,
.medtekgridrow,
.medtekgridrowedit,
.medtekgridrowalt,
.medtekgridrowred,
.medtekgridrowgreen,
.medtekgridrowgrey,
.medtekgridrowcyan {
    vertical-align: top;
    white-space: normal;
}

.medtekgridrowtrans {
    background-color: Transparent;
}

/* for sub-grids inside of grids */
.medtekgridrowsub {
    background-color: Transparent;
}

.medtekgridrow {
    background-color: White;
}

.medtekgridrowedit {
    background-color: #ffff90;
}

.medtekgridrowalt {
    background-color: #EEEEFF;      /*original medtek*/

    /*background-color: #F2F6F9;*/ /*v1 nimble*/
    /*background-color: #EFFFFE;*/ /*nimble teal light*/
    /*background-color: #EFF1F2;*/ /*nimble navy light*/
}

.medtekgridrowred {
    background-color: #ffc3c3;
}

.medtekgridrowgreen {
    background-color: #c3ffc3;
}

.medtekgridrowgrey {
    background-color: lightgray;
}

.medtekgridrowcyan {
    background-color: lightcyan;
}

tr.medtekgridrow:hover,
tr.medtekgridrowalt:hover,
tr.medtekgridrowred:hover,
tr.medtekgridrowgreen:hover,
tr.medtekgridrowgrey:hover,
tr.medtekgridrowcyan:hover,
tr.medtekgridrow:hover td,
tr.medtekgridrowalt:hover td,
tr.medtekgridrowred:hover td,
tr.medtekgridrowgreen:hover td,
tr.medtekgridrowgrey:hover td,
tr.medtekgridrowcyan:hover td {
    background-color: #ffff55 !important;
}

tr.codinggrid td {
    padding-top: 5px;
    padding-bottom: 5px;
}

    /* kill me now omg */
    tr.codinggrid td table.invisibletable td {
        padding-top: 1px;
        padding-bottom: 0px;
    }

/* applied to the row to make a header for status type */
.codingheaderNew {
    border-top: 2px solid #808080;
}

.codingheaderCoded {
    border-top: 2px solid #0F0F7F;
}

.codingheaderAwaitingInfo {
    border-top: 2px solid #FF1000;
}

.codingheaderInfoProvided {
    border-top: 2px solid #6E0F7F;
}

.codingheaderComplete {
    border-top: 2px solid #008900;
}

.codingheaderQuery {
    border-top: 2px solid #0B8CA3;
}

.codingheaderQueryResolved {
    border-top: 2px solid #FF7200;
}


/* Coding Sub Grid */

td.csgContainer {
    padding: 0 !important;
    padding-top: 4px !important;
    padding-bottom: 5px !important;
}

.codingsubgrid {
    /*border: 1px lightgray solid;*/
    border-top: none;
    border-collapse: collapse;
    text-align: left;
    color: Black;
    font-weight: normal;
    text-decoration: none;
    vertical-align: top;
    background-color: transparent;
    overflow: auto;
}

    .codingsubgrid tr {
        vertical-align: top;
        white-space: normal;
    }


table.codingsubgrid td {
    padding: 1px 2px 0px 2px;
    border: none;
    /*    border-bottom: 1px lightgray solid;
    border-top: 1px lightgray solid;
    border-left: 1px lightgray solid;
    border-right: 1px lightgray solid;  */
}

/*
.codingsubgrid tr:hover {
    background-color: transparent; /* #8eff35;
}*/


/* The divs are for the header, and the td's are for the grid - widths need to match. 
    
    These min-widths are so if we have a BLANK grid, it still takes up enough horizontal space so the header is wide enough (because it uses same class). 
    For the blank one, use a td that fills place of CPT, MOD, ICD, Units and give it csgNODATA and then add td's for any CL's, plus Note

*/
td.csgNODATA {
    min-width: 266px; /* make sure this is sum of csgCPT, csgMOD, cvgICD and csgUnits plus padding (4 ea.) plus any more you add. */
    max-width: 266px;
}

td.csgCPT {
    min-width: 50px;
    max-width: 50px;
}

td.csgMOD {
    min-width: 40px;
    max-width: 40px;
}

td.csgICD {
    min-width: 80px;
    max-width: 80px;
}

td.csgUnits {
    min-width: 40px;
    max-width: 40px;
}

td.csgCL {
    min-width: 40px;
    max-width: 40px;
}

td.csgNote {
    min-width: 150px;
    max-width: 150px;
}

div.csgCPT, div.csgMOD, div.csgICD, div.csgUnits, div.csgCL, div.csgNote {
    padding: 0px 2px 0px 2px;
}

div.csgCPT, div.csgMOD, div.csgICD, div.csgUnits, div.csgCL, div.csgNote, div.csgUnits {
    float: left;
}

div.csgCPT {
    width: 50px;
}

div.csgMOD {
    width: 40px;
}

div.csgICD {
    width: 60px;
}

div.csgUnits {
    width: 40px;
}

div.csgCL {
    width: 40px;
}

div.csgNote {
    width: 120px;
}

/* Colors for coding grid status text */

.csNew {
    color: #808080;
}

.csCoded {
    color: #0F0F7F;
}

.csAwaitingInfo {
    color: #FF1000;
}

.csInfoProvided {
    color: #6E0F7F;
}

.csComplete {
    color: #008900;
}

.csQuery {
    color: #0B8CA3;
}

.csQueryResolved {
    color: #FF7200;
}

.csCancelled {
    color: #404040;
}
.csDelivered {
    color: #005300;
}
.csSupervisorReview {
    color: #E436DB;
}

.csDate {
    color: #606060;
    font-size: 8px;
}



/*  Field labels and values.  They have a small version and a light version (for dark backgrounds) too. 
	Selects and Inputs have separate settings because you may not want them to look exactly the same 
	fieldvalue is a special case of fieldvalue, for values being searched for. 

	Heights and text sizes/line height etc is set up by fieldlabel/fieldvalue classes.

	Then they are placed in fieldelement /editorfieldelement divs and those set their widths to fit. 

*/



.fieldlabel,
.fieldlabel-light,
.fieldlabel-longtext {
    padding-right: 2px;
    text-align: right;
    white-space: nowrap;
    font-size: 11px;
    line-height: 15px;
    font-weight: normal;
    text-decoration: none;
    color: #12364C;
    display: inline-block;
}

.fieldlabel-light {
    color: White;
}

.fieldlabel-longtext {
    width: auto !important;
    padding-right: 4px;
    padding-left: 4px;
    text-align: justify;
    white-space: normal;
    height: auto;
}

/* you can put items in a fieldvalue div and it will apply these styles to contents like inputs, selects, etc, 
	or you can apply the classes directly - thats why we have both versions here */

.fieldvalue,
.fieldvalue-light,
.fieldvalue input,
.fieldvalue-light input,
.fieldvalue select,
.fieldvalue-light select,
.fieldvalue textarea,
.fieldvalue-light textarea {
    vertical-align: top;
    text-align: left;
    font-size: 12px;
    line-height: 15px;
    font-weight: bold;
    text-decoration: none;
    white-space: nowrap;
    overflow: hidden;
    border-width: 1px;
}

    .fieldvalue,
    .fieldvalue input,
    .fieldvalue select,
    .fieldvalue textarea {
        color: Black;
    }


.fieldvalue-light {
    color: White;
}
/*
div.fieldvalue {
    height: 18px;
}*/

.fieldvalue-longtext {
    text-align: justify;
    white-space: normal;
    height: auto !important;
}

.fieldvalue select,
select.fieldvalue,
.fieldvalue input,
input.fieldvalue,
.fieldvalue textarea
textarea.fieldvalue {
    font-size: 11px;
    line-height: 14px;
}

.fieldvalue select,
select.fieldvalue {
    height: 18px; /* for some reason the select height includes borders & padding */
    padding: 0;
}

.fieldvalue input,
input.fieldvalue {
    height: 14px; /* but input uses proper box model */
}

    /* may have to do these like checkboxes */

    input[type="file"].fieldvalue,
    .fieldvalue input[type="file"] {
        height: 18px;
        border: solid 1px gray;
    }

input.fieldvalue,
select.fieldvalue,
textarea.fieldvalue,
input.fieldvalue-light,
select.fieldvalue-light,
textarea.fieldvalue-light,
.fieldvalue input,
.fieldvalue-light input,
.fieldvalue select,
.fieldvalue-light select,
.fieldvalue textarea,
.fieldvalue-light textarea {
    background-color: White;
    font-weight: normal;
    border: solid 1px gray;
}

/* IE6 does not support type selectors so we need to apply "fieldvaluecheck" to checkboxes to style the boxes themselves. 
	if you have a checkbox outside of a fieldvalue div that you want to apply these styles to, apply both classes like 
	class="fieldvalue-light fieldvaluecheck" else you can just apply "fieldvaluecheck"
*/
.fieldvaluecheck input,
input.fieldvaluecheck {
    width: auto !important;
    height: auto !important;
    border: none !important;
    background: transparent !important;
    margin-top: 1px;
    padding-top: 1px;
}

/* for the labels next to the checkboxes.
    Also you can set text to fieldvaluelabel to make it look like those. 
 */
label.fieldvalue,
label.fieldvalue-light,
.fieldvalue label,
.fieldvalue-light label,
.fieldvaluelabel {
    margin-left: 4px;
    font-size: 11px;
    line-height: 15px;
    font-weight: normal;
    text-decoration: none;
    vertical-align: top;
    color: #12364C;
}

label.fieldvalue-light,
.fieldvalue-light label,
.fieldvaluelabel-light {
    color: White;
}

input.fieldvalue:focus,
select.fieldvalue:focus,
input.fieldvalue-light:focus,
select.fieldvalue-light:focus,
.fieldvalue input:focus,
.fieldvalue select:focus,
.fieldvalue-light input:focus,
.fieldvalue-light select:focus {
    background-color: #ffff90;
    font-weight: normal;
}


/* apply this to give "impact" to a value - make user take note of it  */
select.fieldvalue-impact,
input.fieldfalue-impact {
    background-color: Yellow;
    font-weight: bold;
}

/* a field element is a div containing 2 more divs, the label and the value.  Fixed width.  Container can size.  */
/* a double element is twice the width of a normal one  - but label part stays same */
/* a half element is half the width - but label part stays same */


/*  these are set up to fit two across in a (800px) page width div.    
	the fieldelement-double option is applied instead of fieldelement to make it double width so only one fits across
    -half will make it half as wide so 4 fit across. 

	You can also use fieldelement-wide to fit things 2 cols in a 1024px page width (and use fieldelement-widedouble)
    wide elements have more space for the label as well as the value 

    -wide2 (and -wide2double) are an alternate version of -wide where the label stays same size 
    but the value gets larger.  Used in new versions of filter

    there is a -widehalf and -wide2half that will fit 4 across 

    fieldelement-narrow is set up to allow three across in a 1024.  Can have -narrowdouble but no -narrowhalf .  

	Fieldelement-tall is applied as a modifier to fieldelement or -double or -wide etc
	It allows an element to size to height of contents

    -2high makes twice as high as normal


*/

div.fieldelement,
div.fieldelement-half,
div.fieldelement-double,
div.fieldelement-wide,
div.fieldelement-widehalf,
div.fieldelement-widedouble,
div.fieldelement-wide2,
div.fieldelement-wide2half,
div.fieldelement-wide2double,
div.fieldelement-narrow,
div.fieldelement-narrowdouble {
    vertical-align: top;
    white-space: nowrap;
    height: 18px;
    margin: 1px 0 1px 0;
    padding: 0;
    border: none;
    float: left;
}

div.fieldelement {
    width: 368px;
}

div.fieldelement-half {
    width: 184px;
}

div.fieldelement-double {
    width: 736px;
}

div.fieldelement-wide,
div.fieldelement-wide2 {
    width: 480px;
}

div.fieldelement-widedouble,
div.fieldelement-wide2double {
    width: 960px;
}

div.fieldelement-widehalf,
div.fieldelement-wide2half {
    width: 240px;
}

div.fieldelement-narrow {
    width: 320px;
}

div.fieldelement-narrowdouble {
    width: 640px;
}

/* makes it size with contents */
.fieldelement-tall, .fieldelement-tall div {
    height: auto !important;
}

.fieldelement-2high, .fieldelement-2high div {
    height: 36px !important;
}

.fieldelement-tall span {
    text-align: left;
    vertical-align: top;
    overflow: hidden;
    white-space: pre-wrap;
}

/* width of fieldlabel + fieldvalue + 4 = fieldelement */

/* Note that the -narrow's and -wide2's have same label lengths as normal field elements */

div.fieldelement div.fieldlabel,
div.fieldelement-half div.fieldlabel,
div.fieldelement-double div.fieldlabel,
div.fieldelement-wide2 div.fieldlabel,
div.fieldelement-wide2half div.fieldlabel,
div.fieldelement-wide2double div.fieldlabel,
div.fieldelement-narrow div.fieldlabel,
div.fieldelement-narrowdouble div.fieldlabel {
    width: 90px;
    float: left;
}

/* only -wide and -widedouble has wider label */

div.fieldelement-wide div.fieldlabel,
div.fieldelement-widedouble div.fieldlabel {
    width: 168px;
    float: left;
}

/* Values get bigger or smaller */

/* 90 + 274 + 4 = 368 */
div.fieldelement div.fieldvalue {
    width: 274px;
    float: right;
}

/* 90 + 90 + 4 = 184 */
div.fieldelement-half div.fieldvalue {
    width: 90px;
    float: right;
}

/* 90 + 642 + 4 = 736 */
div.fieldelement-double div.fieldvalue {
    width: 642px;
    float: right;
}

/* 90 + 226 + 4 = 320 */
div.fieldelement-narrow div.fieldvalue {
    width: 226px;
    float: right;
}

/* 90 + 546 + 4 = 640 */
div.fieldelement-narrowdouble div.fieldvalue {
    width: 546px;
    float: right;
}

/* 168 + 308 + 4 = 480 */
div.fieldelement-wide div.fieldvalue {
    width: 308px;
    float: right;
}

/* 168 + 68 + 4 = 240 */
div.fieldelement-widehalf div.fieldvalue {
    width: 68px;
    float: right;
}

/* 168 + 788 + 4 = 960 */
div.fieldelement-widedouble div.fieldvalue {
    width: 788px;
    float: right;
}

/* 90 + 308 + 4 = 480 */
div.fieldelement-wide2 div.fieldvalue {
    width: 386px;
    float: right;
}

/* 90 + 146 + 4 = 240 */
div.fieldelement-wide2half div.fieldvalue {
    width: 146px;
    float: right;
}

/* 90 + 866 + 4 = 960 */
div.fieldelement-wide2double div.fieldvalue {
    width: 866px;
    float: right;
}


div.fieldelement select.fieldvalue,
div.fieldelement .fieldvalue select,
div.fieldelement-half select.fieldvalue,
div.fieldelement-half .fieldvalue select,
div.fieldelement-double select.fieldvalue,
div.fieldelement-double .fieldvalue select,
div.fieldelement-narrow select.fieldvalue,
div.fieldelement-narrow .fieldvalue select,
div.fieldelement-narrowdouble select.fieldvalue,
div.fieldelement-narrowdouble .fieldvalue select,
div.fieldelement-wide select.fieldvalue,
div.fieldelement-wide .fieldvalue select,
div.fieldelement-widehalf select.fieldvalue,
div.fieldelement-widehalf .fieldvalue select,
div.fieldelement-widedouble select.fieldvalue,
div.fieldelement-widedouble .fieldvalue select,
div.fieldelement-wide2 select.fieldvalue,
div.fieldelement-wide2 .fieldvalue select,
div.fieldelement-wide2half select.fieldvalue,
div.fieldelement-wide2half .fieldvalue select,
div.fieldelement-wide2double select.fieldvalue,
div.fieldelement-wide2double .fieldvalue select {
    width: 100%;
}

/* inputs and textarea are 6 less  */

div.fieldelement input.fieldvalue,
div.fieldelement .fieldvalue input,
div.fieldelement textarea.fieldvalue,
div.fieldelement .fieldvalue textarea,
div.fieldelement-half input.fieldvalue,
div.fieldelement-half .fieldvalue input,
div.fieldelement-half textarea.fieldvalue,
div.fieldelement-half .fieldvalue textarea,
div.fieldelement-double input.fieldvalue,
div.fieldelement-double .fieldvalue input,
div.fieldelement-double textarea.fieldvalue,
div.fieldelement-double .fieldvalue textarea,
div.fieldelement-narrow input.fieldvalue,
div.fieldelement-narrow .fieldvalue input,
div.fieldelement-narrow textarea.fieldvalue,
div.fieldelement-narrow .fieldvalue textarea,
div.fieldelement-narrowdouble input.fieldvalue,
div.fieldelement-narrowdouble .fieldvalue input,
div.fieldelement-narrowdouble textarea.fieldvalue,
div.fieldelement-narrowdouble .fieldvalue textarea,
div.fieldelement-wide input.fieldvalue,
div.fieldelement-wide .fieldvalue input,
div.fieldelement-wide textarea.fieldvalue,
div.fieldelement-wide .fieldvalue textarea,
div.fieldelement-widehalf input.fieldvalue,
div.fieldelement-widehalf .fieldvalue input,
div.fieldelement-widehalf textarea.fieldvalue,
div.fieldelement-widehalf .fieldvalue textarea,
div.fieldelement-widedouble input.fieldvalue,
div.fieldelement-widedouble .fieldvalue input,
div.fieldelement-widedouble textarea.fieldvalue,
div.fieldelement-widedouble .fieldvalue textarea,
div.fieldelement-wide2 input.fieldvalue,
div.fieldelement-wide2 .fieldvalue input,
div.fieldelement-wide2 textarea.fieldvalue,
div.fieldelement-wide2 .fieldvalue textarea,
div.fieldelement-wide2half input.fieldvalue,
div.fieldelement-wide2half .fieldvalue input,
div.fieldelement-wide2half textarea.fieldvalue,
div.fieldelement-wide2half .fieldvalue textarea,
div.fieldelement-wide2double input.fieldvalue,
div.fieldelement-wide2double .fieldvalue input,
div.fieldelement-wide2double textarea.fieldvalue,
div.fieldelement-wide2double .fieldvalue textarea {
    width: calc(100% - 6px);
}

/* inputs different */

div.fieldelement input[type="file"].fieldvalue,
div.fieldelement .fieldvalue input[type="file"],
div.fieldelement-half input[type="file"].fieldvalue,
div.fieldelement-half .fieldvalue input[type="file"],
div.fieldelement-double input[type="file"].fieldvalue,
div.fieldelement-double .fieldvalue input[type="file"],
div.fieldelement-narrow input[type="file"].fieldvalue,
div.fieldelement-narrow .fieldvalue input[type="file"],
div.fieldelement-narrowdouble input[type="file"].fieldvalue,
div.fieldelement-narrowdouble .fieldvalue input[type="file"],
div.fieldelement-wide input[type="file"].fieldvalue,
div.fieldelement-wide .fieldvalue input[type="file"],
div.fieldelement-widehalf input[type="file"].fieldvalue,
div.fieldelement-widehalf .fieldvalue input[type="file"],
div.fieldelement-widedouble input[type="file"].fieldvalue,
div.fieldelement-widedouble .fieldvalue input[type="file"],
div.fieldelement-wide2 input[type="file"].fieldvalue,
div.fieldelement-wide2 .fieldvalue input[type="file"],
div.fieldelement-wide2half input[type="file"].fieldvalue,
div.fieldelement-wide2half .fieldvalue input[type="file"],
div.fieldelement-wide2double input[type="file"].fieldvalue,
div.fieldelement-wide2double .fieldvalue input[type="file"] {
    width: calc(100% - 2px);
    height:20px !important;
}




/* specified heights for textarea that will fit two, three lines in */

/* has to be applied direcly to the textarea */
textarea.fieldelement-twotall {
    height: 30px !important; /* inner height (14) x2 + borders */
    white-space: pre-wrap !important;
}

/* has to be applied direcly to the textarea */
textarea.fieldelement-threetall {
    height: 45px !important; /* inner height (14) x3 + borders */
    white-space: pre-wrap !important;
}



.modalbackground {
    background-color: White;
    /*filter: alpha(opacity=70);*/
    opacity: 0.7;
    z-index: 6000 !important;
}


/* for my textboxes that have labels until you click them */
.text-insidelabel {
    color: #cdcdcd !important;
    font-weight: bold !important;
}



/******************************/
/*  Status Message CSS        */
/******************************/


div.SM_StatusMessage {
    width: 100%;
    /* height: 26px; */
    text-align: left;
    padding: 0px;
    margin: 0px 0px 0px 4px;
    font-size: 11px;
    z-index: 100;
}

.SM_ShortText {
    width: 100%;
    overflow: hidden;
    z-index: 100;
    line-height: 13px;
}

.SM_Info {
    color: #008000;
    z-index: 100;
}

.SM_Error {
    color: #f00000;
    z-index: 100;
}

/******************************/

/* simple text */
.good {
    color: #009800;
}

.bad {
    color: Red;
}


/* for displaying signatures in doc editor */
img.signature {
    border: none;
    margin: 5px;
    padding: 0;
}

/* for exception status.   */
.exceptionsno {
    color: #009800;
}

.exceptionsyes {
    color: Red;
}

.exceptionsnobright {
    color: #00ff00;
}

.exceptionsyesbright {
    color: #ff8080;
}

/* for validation errors.  combine with local fieldvalue class.  */
.validationerror {
    color: #CC0000;
}

/* the label for what page you are on, in the header */
.insideheaderlabel {
    height: 25px;
    width: 220px;
    padding: 0;
    margin: 0;
    text-align: right;
    font-weight: bold;
    font-style: italic;
    font-variant: small-caps;
    font-size: 15px;
    white-space: nowrap;
    color: #12364C;
}


/* section headers */
.sh-normal,
.sh-small,
.sh-sel,
.sh-light {
    vertical-align: top;
    font-variant: small-caps;
    font-style: italic;
    color: #eeeeff;
    font-size: 14px;
    line-height: 18px;
    font-weight: bold;
    float: left;
    margin-left: 4px;
    margin-top: 0px;
    margin-bottom: 2px;
}

.sh-light {
    color: White;
}

.sh-small {
    font-size: 11px;
    line-height: 15px;
}

.sh-sel {
    color: #FFFF00;
}

.filtertypes {
    margin-left: 4px;
    margin-right: 4px;
    float: left;
    vertical-align: top;
    font-variant: small-caps;
    text-decoration: none;
    font-style: italic;
    font-weight: bold;
    color: White;
    font-size: 11px;
}

    .filtertypes:hover {
        color: #FFFF00;
        text-decoration: none;
    }




.wrapok {
    white-space: normal;
}

/* tag these on to modify existing styles */

.mediumtext {
    font-family: "Segoe UI", Helvetica, Arial, "Arial Unicode MS", Sans-Serif;
    font-size: 11px;
}


.smalltext {
    font-family: "Segoe UI Light","Segoe WPC","Segoe UI", Helvetica, Arial, "Arial Unicode MS", Sans-Serif;
    font-size: 9px;
}

.tinytext {
    font-family: "Segoe UI Light","Segoe WPC","Segoe UI", Helvetica, Arial, "Arial Unicode MS", Sans-Serif;
    font-size: 8px;
}

.wrapok {
    white-space: normal;
}

.nowrap {
    white-space: nowrap;
}

.centeredtext {
    text-align: center;
}

.verticallycenteredtext {
    /*     display:inline-block;  */
    vertical-align: middle;
}

.verticallytoptext {
    /*    display:inline-block;   */
    vertical-align: top;
}

.verticallybottomtext {
    /*    display:inline-block;   */
    vertical-align: bottom;
}

/* Styles for Admin Notes/Client Notes in grids */
.adminnotes {
    font-style: italic;
}

.clientnotes {
    font-style: normal;
}



/* Styles for notes in Coding Jobs.  We have admin notes, client notes made by admin/mt, and client notes made by client. 
    Client ones have a citation section as well, which should be "faded" in comparison.  Right now admin citation is defined but not used */

.adminnote {
    color: #b100cc;
}

.adminnotecitation {
    color: #87039b;
    font-size: smaller;
}

.clientnotebyadminmt {
    color: #048e04;
}

.clientnotebyadminmtcitation {
    color: #016201;
    font-size: smaller;
}

.clientnotebyclient {
    color: #0024fe;
}

.clientnotebyclientcitation {
    color: #0017a5;
    font-size: smaller;
}


/* for icons */
.iconimg {
    border: none;
    width: 16px;
    height: 16px;
    vertical-align: middle;
}


/* a div that makes a better HR */
.hrdiv {
    font-size: 0;
    display: block;
    height: 0;
    border-bottom: Solid 1px Black;
    border-top: none;
    margin: 1px 0 1px 0;
    padding: 0 0 0 0;
    width: 100%;
}

.hrdiv-tall {
    font-size: 0;
    display: block;
    height: 0;
    border-bottom: Solid 1px Black;
    border-top: none;
    margin: 10px 0 10px 0;
    padding: 0 0 0 0;
    width: 100%;
}

/* text styles for fax status */
.faxactive {
    color: Green;
}

.faxsent {
    color: Blue;
}

.faxheld {
    color: Orange;
}

.faxcancelled {
    color: Purple;
}

.faxfailed {
    color: Red;
}



/**************************************
	 Nice Button CSS                    
	 moved to buttons.css
**************************************/



/* ajax_tab_medtek-theme theme */

.ajax_tab_medtek-theme .ajax__tab_body {
    width: 100%;
}

.ajax_tab_medtek-theme .ajax__tab_header {
    margin-top: 2px;
    background: url(/images/tab-line.png) repeat-x bottom;
    font-size: 11px;
    line-height: 14px;
    display: block;
}

    .ajax_tab_medtek-theme .ajax__tab_header .ajax__tab_outer {
        background: url(/images/tab.png) no-repeat left top;
        padding-left: 10px;
        margin-right: 3px;
    }

    .ajax_tab_medtek-theme .ajax__tab_header .ajax__tab_inner {
        background: url(/images/tab.png) no-repeat right top;
        color: #444444;
        padding: 0px 10px 0px 0px;
    }

.ajax_tab_medtek-theme .ajax__tab_hover .ajax__tab_inner {
    color: Yellow;
}

.ajax_tab_medtek-theme .ajax__tab_active .ajax__tab_outer {
    background: url(/images/tab.png) no-repeat 0pt -20px;
    border-bottom-color: #ffffff;
}

.ajax_tab_medtek-theme .ajax__tab_active .ajax__tab_inner {
    background: url(/images/tab.png) no-repeat right -20px;
    color: Black;
    border-color: #333;
}

.ajax_tab_medtek-theme .ajax__tab_body {
    padding: 0px; /*    background-color: #4277AD;  */
    background-color: #f0f0f0 !important;
    visibility: visible;
    border: none;
    border-top-width: 0;
    z-index: 4;
}


/* ajax_tab_pp-theme theme */

.ajax_tab_pp-theme .ajax__tab_body {
    width: 100%;
}

.ajax_tab_pp-theme .ajax__tab_header {
    margin-top: 2px;
    /*background: url(/images/tab-line.png) repeat-x bottom;*/
    /*font-size: 13px;*/
    line-height: 14px;
    display: block;
}

    .ajax_tab_pp-theme .ajax__tab_header .ajax__tab_outer {
        /*background: url(/images/tab.png) no-repeat left top;*/
        /*padding-left: 10px;*/
        margin-right: 3px;        
    }

    .ajax_tab_pp-theme .ajax__tab_header .ajax__tab_inner {
        /*background: url(/images/tab.png) no-repeat right top;*/
        padding: 10px;
        border-radius: 100px;
        width: 150px;
        text-align: center;
        /*color: #444444;*/
        /*padding: 0px 10px 0px 0px;*/
    }


.ajax_tab_pp-theme .ajax__tab_hover .ajax__tab_inner {
    background: #5f9ccf;
}

    .ajax_tab_pp-theme .ajax__tab_hover .ajax__tab_inner a {
        color: yellow !important;
    }

.ajax_tab_pp-theme .ajax__tab_active .ajax__tab_outer {
    background-color: blue;
    border-radius: 100px;
    color: white !important;
    border-bottom-color: #ffffff;
}

.ajax_tab_pp-theme .ajax__tab_active .ajax__tab_outer a {
    color: white !important;    
}

.ajax_tab_pp-theme .ajax__tab_active .ajax__tab_inner {
    /*background: url(/images/tab.png) no-repeat right -20px;*/
    color: white !important;
    /*border-color: #333;*/
}

.ajax_tab_pp-theme .ajax__tab_body {
    padding: 0px; /*    background-color: #4277AD;  */
    background-color: white !important;
    visibility: visible;
    border: none;
    border-top-width: 0;
    z-index: 4;
}




/********************************************************/
/* HELP StyleSheet                                      */
/********************************************************/

.helptext {
    width: 740px;
    background-image: url(/images/2partgradient_nimblenavy.png);
    background-repeat: repeat-x;
    background-color: #D2D5D6;
    margin: 0 auto;
    border-radius: 6px;
    padding: 2px 2px 2px 2px;
    overflow: visible;
}

    .helptext a {
        font-size: 110%;
    }

    .helptext p {
        margin-top: 3px;
    }

#tutorials a {
    text-decoration: none;
}

.dictLinesDouble {
    margin-top: 3px;
    margin-left: 35%;
}

.dictLinesSingle {
    margin-top: 3px;
    margin-left: 42%;
}

a.VF {
    cursor: pointer;
    text-decoration: underline;
}

/**************************************
	 New Button CSS                    
	 
**************************************/

/* a button bar */
div.nbbar {
    float: right;
    height:20px;
}

/* make the button not float but instead look OK in a fieldvalue */
button.nbfix,
select.nbfix,
input.nbfix {
    float: none !important;
    vertical-align: top !important;
    margin-top: 1px !important;
}

button.nbleftspace,
select.nbleftspace,
input.nbleftspace {
    margin-left: 6px !important;
}

button.nbrightspace,
select.nbrightspace,
input.nbrightspace {
    margin-right: 6px !important;
}

/* button types are:
    nbaction            does something
    nbspecialaction     does something important
    nbfilter            used in filters, search button
    nbnav               used in navigation buttons
    nbok                means OK, usually does something or confirms 
    nbcancel            means no or cancel, aborts, also clear search filters 
    nbdone              I am done, but will not do anything 
    nbattention         Something important that you should pay attention to
    nbwarning           Something dangerous, be careful 
    nbdisabled          option is disabled 

    You must specify a button type. 
*/

/* button sizes are nb16, nb20, nb24 and nb30, various pixel sizes.  If you do not specify, will be nb20  */

/* applies to all */
button.nbaction,
button.nbspecialaction,
button.nbfilter,
button.nbnav,
button.nbok,
button.nbcancel,
button.nbdone,
button.nbattention,
button.nbwarning,
button.nbdisabled {
    position: relative;
    border: 0 none;
    margin: 0 1px 0 1px;
    overflow: visible;
    text-align: center;
    width: auto;
    outline: none;
    float: left;
    /* These set default nb20 size, you override with nb16 etc below */
    border-radius: 4px;
    height: 20px;
    line-height: 20px;
    padding: 0px 8px 0px 0px; /* this is the left padding - right padding is in the span css below */
}

    /* applies to text in all nicebuttons */

    button.nbaction span,
    button.nbspecialaction span,
    button.nbfilter span,
    button.nbnav span,
    button.nbok span,
    button.nbcancel span,
    button.nbdone span,
    button.nbattention span,
    button.nbwarning span,
    button.nbdisabled span {
        position: relative;
        display: block;
        white-space: nowrap;
        font-family: "Verdana", Arial, Sans-Serif;
        font-weight: bold;
        outline: none;
        /* default to nb20 size, you override with nb16 etc below */
        padding: 0px 0px 0px 8px;
        height: 20px;
        line-height: 18px;
        font-size: 9px;
    }


/* all but disabled */
button.nbaction,
button.nbspecialaction,
button.nbfilter,
button.nbnav,
button.nbok,
button.nbcancel,
button.nbdone,
button.nbattention,
button.nbwarning {
    cursor: pointer;
}

/* just disabled */
button.nbdisabled {
    cursor: auto;
}

/* note padding is overridden in nb16 and nb16 span */
button.nb16 {
    border-radius: 4px;
    height: 16px;
    line-height: 16px;
    padding: 0px 6px 0px 0px; /* this is the left padding - right padding is in the span css below */
}

    button.nb16 span {
        padding: 0px 0px 0px 6px;
    }

button.nb20 {
    border-radius: 4px;
    height: 20px;
    line-height: 20px;
}

button.nb24 {
    border-radius: 6px;
    height: 24px;
    line-height: 24px;
}

button.nb30 {
    border-radius: 8px;
    height: 30px;
    line-height: 30px;
}

/* color of text in button.  These have dark color so text is white */
button.nbaction span,
button.nbspecialaction span,
button.nbfilter span,
button.nbnav span,
button.nbok span,
button.nbcancel span,
button.nbdone span,
button.nbdisabled span,
button.nbwarning span {
    color: #FFFFFF;
}

/* this one has light color so text is red */
button.nbattention span {
    color: #c00000;
}

/* text size different between different size buttons */
button.nb16 span {
    height: 16px;
    line-height: 14px;
    font-size: 8px;
}

button.nb20 span {
    height: 20px;
    line-height: 18px;
    font-size: 9px;
}

button.nb24 span {
    height: 24px;
    line-height: 22px;
    font-size: 12px;
}

button.nb30 span {
    height: 30px;
    line-height: 30px;
    font-size: 14px;
}

/* colors and gradients, may move these around.  */
/* hover goes to yellow and changes text color to red.  Disabled one has no hover settings.  attention one is yellow so goes to green with white text */
/* Active is when clicked.  Gradient reverses and text changes.  Note disabled cant be clicked.  */

/* note the hover has to come before the active but after main or active wont work */

button.nbaction {
    /* The blue button color on website */
    background-image: linear-gradient(#4F84BA, #225180);
    background-color: #3C6FA1;
}

    button.nbaction:hover {
        background-image: linear-gradient(#FFF800, #F7CD00);
        background-color: #FFE000;
    }

        /* text color */
        button.nbaction:hover span {
            color: #c00000;
        }

    button.nbaction:active {
        /* The blue button color on website */
        background-image: linear-gradient(#225180, #4F84BA);
    }

        /* Active text color */
        button.nbaction:active span {
            color: #ffff00;
            outline: none;
        }

button.nbspecialaction {
    /* Darker than the blue button color on website */
    background-image: linear-gradient(#3240DB, #141D87);
    background-color: #1A26AF;
}

    button.nbspecialaction:hover {
        background-image: linear-gradient(#FFF800, #F7CD00);
        background-color: #FFE000;
    }

        button.nbspecialaction:hover span {
            color: #c00000;
        }

    button.nbspecialaction:active {
        /* Darker than the blue button color on website */
        background-image: linear-gradient(#141D87, #3240DB);
    }

        button.nbspecialaction:active span {
            color: #ffff00;
            outline: none;
        }

button.nbfilter {
    /* lighter than the blue button color on website */
    background-image: linear-gradient(#3DAEAF, #02787A);
    background-color: #039BA0;
}

    button.nbfilter:hover {
        background-image: linear-gradient(#FFF800, #F7CD00);
        background-color: #FFE000;
    }

        button.nbfilter:hover span {
            color: #c00000;
        }

    button.nbfilter:active {
        /* lighter than the blue button color on website */
        background-image: linear-gradient(#02787A, #3DAEAF);
    }

        button.nbfilter:active span {
            color: #ffff00;
            outline: none;
        }

button.nbnav {
    /* plum */
    background-image: linear-gradient(#8E255F, #60103C);
    background-color: #701346;
    /* almost black */
    /*background-image: linear-gradient(#727272, #2D2D2D); */
}

    button.nbnav:hover {
        background-image: linear-gradient(#FFF800, #F7CD00);
        background-color: #FFE000;
    }

        button.nbnav:hover span {
            color: #c00000;
        }

    button.nbnav:active {
        /* plum */
        background-image: linear-gradient(#60103C, #8E255F);
        /* almost black */
        /*background-image: linear-gradient(#2D2D2D, #727272); */
    }

        button.nbnav:active span {
            color: #ffff00;
            outline: none;
        }

button.nbok {
    /* The green button color on website */
    background-image: linear-gradient(#16A700, #1C6F10);
    background-color: #198609;
}

    button.nbok:hover {
        background-image: linear-gradient(#FFF800, #F7CD00);
        background-color: #FFE000;
    }

        button.nbok:hover span {
            color: #c00000;
        }

    button.nbok:active {
        /* The green button color on website */
        background-image: linear-gradient(#1C6F10, #16A700);
    }

        button.nbok:active span {
            color: #ffff00;
            outline: none;
        }

button.nbcancel {
    /* The red button color on website */
    background-image: linear-gradient(#C70606, #6C0707);
    background-color: #9A0606;
}

    button.nbcancel:hover {
        background-image: linear-gradient(#FFF800, #F7CD00);
        background-color: #FFE000;
    }

        button.nbcancel:hover span {
            color: #c00000;
        }

    button.nbcancel:active {
        /* The red button color on website */
        background-image: linear-gradient(#6C0707, #C70606);
    }

        button.nbcancel:active span {
            color: #ffff00;
            outline: none;
        }

button.nbdone {
    /* darker than the green button color on website */
    background-image: linear-gradient(#1A8709, #0E4905);
    background-color: #126006;
}

    button.nbdone:hover {
        background-image: linear-gradient(#FFF800, #F7CD00);
        background-color: #FFE000;
    }

        button.nbdone:hover span {
            color: #c00000;
        }

    button.nbdone:active {
        /* darker than the green button color on website */
        background-image: linear-gradient(#0E4905, #1A8709);
    }

        button.nbdone:active span {
            color: #ffff00;
            outline: none;
        }

button.nbattention {
    /* The yellow button color on website */
    background-image: linear-gradient(#FFF800, #F7CD00);
    background-color: #FFE000;
}

    button.nbattention:hover {
        /* attention is yellow so hover goes green */
        background-image: linear-gradient(#16A700, #1C6F10);
        background-color: #198609;
    }

        button.nbattention:hover span {
            color: #ffffff;
        }

    button.nbattention:active {
        /* The yellow button color on website */
        background-image: linear-gradient(#F7CD00, #FFF800);
    }

        /* attention has different text color */
        button.nbattention:active span {
            color: #ff0000;
            outline: none;
        }

button.nbwarning {
    /* dark red  */
    background-image: linear-gradient(#912525, #560303);
    background-color: #770404;
}

    button.nbwarning:hover {
        background-image: linear-gradient(#FFF800, #F7CD00);
        background-color: #FFE000;
    }

        button.nbwarning:hover span {
            color: #c00000;
        }

    button.nbwarning:active {
        /* The red button color on website */
        background-image: linear-gradient(#560303, #912525);
    }

        button.nbwarning:active span {
            color: #ffff00;
            outline: none;
        }



/* disabled is never active and does not hover */
button.nbdisabled {
    /* The grey button color on website */
    background-image: linear-gradient(#ABABAB, #5A5A5A);
    background-color: #848484;
}


/* checkboxes to go with buttons - just use size classes, no color nb16 nb20 etc - note only 16 and 20 have been tested  */
/* use nblight for white text instead of black */
/* this is the enclosing container - also for text used in nbbar   */
span.nb16,
span.nb20,
span.nb24,
span.nb30 {
    float: left;
    margin-right: 2px;
    margin-left: 2px;
    font-weight: normal;
    text-decoration: none;
    vertical-align: top;
    color: black;
}

    span.nb16 input[type=checkbox],
    span.nb20 input[type=checkbox],
    span.nb24 input[type=checkbox],
    span.nb30 input[type=checkbox] {
        vertical-align: top;
        margin-right: 2px;
        margin-left: 2px;
    }

    span.nb16 input[type=checkbox] {
        margin-top: 0px;
        transform: scale(0.8);
    }

    span.nb20 input[type=checkbox] {
        margin-top: 1px;
        transform: scale(0.9);
    }

    span.nb24 input[type=checkbox] {
        margin-top: 3px;
        transform: scale(1.1);
    }

    span.nb30 input[type=checkbox] {
        margin-top: 6px;
        transform: scale(1.3);
    }

    /* for the labels next to the checkboxes.  */
    span.nb16 label,
    span.nb20 label,
    span.nb24 label,
    span.nb30 label {
        font-weight: normal;
        text-decoration: none;
        vertical-align: top;
        color: black;
    }

span.nblight,
span.nblight label {
    color: white;
}


span.nb16,
span.nb16 label {
    margin-left: 2px;
    margin-right: 2px;
    font-size: 9px;
    line-height: 13px;
}

span.nb20,
span.nb20 label {
    margin-left: 3px;
    margin-right: 3px;
    font-size: 11px;
    line-height: 15px;
}

span.nb24,
span.nb24 label {
    margin-left: 4px;
    margin-right: 4px;
    font-size: 13px;
    line-height: 18px;
}

span.nb30,
span.nb30 label {
    margin-left: 5px;
    margin-right: 5px;
    font-size: 15px;
    line-height: 24px;
}

/* for text boxes to go with buttons  - note only 16 and 20 have been tested */
input[type=text].nb16,
input[type=text].nb20,
input[type=text].nb24,
input[type=text].nb30 {
    /*    -webkit-appearance: none;
    -moz-appearance: none; */
    margin-right: 2px;
    margin-left: 2px;
    font-weight: bold;
    float: left;
    border: 1px;
    font-family: Verdana, Arial, Sans-Serif;
}

    input[type=text].nb16:focus,
    input[type=text].nb20:focus,
    input[type=text].nb24:focus,
    input[type=text].nb30:focus {
        background-color: #ffff90;
    }

/* just the 16s */
input[type=text].nb16 {
    border-radius: 4px;
    padding-right: 4px;
    padding-left: 4px;
    font-size: 8px;
    line-height: 12px;
    height: 14px;
}

/* just the 20s */
input[type=text].nb20 {
    border-radius: 4px;
    padding-right: 6px;
    padding-left: 6px;
    font-size: 9px;
    line-height: 14px;
    height: 18px;
}

/* just the 24s */
input[type=text].nb24 {
    border-radius: 6px;
    padding-right: 6px;
    padding-left: 6px;
    font-size: 12px;
    line-height: 18px;
    height: 22px;
}

/* just the 30s */
input[type=text].nb30 {
    border-radius: 8px;
    padding-right: 6px;
    padding-left: 6px;
    font-size: 14px;
    line-height: 22px;
    height: 28px;
}

/*  For drop downs to go with buttons, these get a usage and a size  - note only 16 and 20 have been tested */


select.nbaction,
select.nbspecialaction,
select.nbfilter,
select.nbnav,
select.nbok,
select.nbcancel,
select.nbdone,
select.nbattention,
select.nbwarning,
select.nbdisabled {
    font-weight: bold;
    float: left;
    border: 1px;
    font-family: Verdana, Arial, Sans-Serif;
    /* force to nb20 if no size specified */
    border-radius: 4px;
    padding-right: 6px;
    padding-left: 6px;
    font-size: 9px;
    line-height: 16px;
    height: 20px;
}

/* all but attention */
select.nbaction,
select.nbspecialaction,
select.nbfilter,
select.nbnav,
select.nbok,
select.nbcancel,
select.nbdone,
select.nbwarning,
select.nbdisabled {
    color: white;
}

/* attention gets red text */
select.nbattention {
    color: #c00000;
}


select.nb16,
select.nb20,
select.nb24,
select.nb30 {
    margin-right: 2px;
    margin-left: 2px;
}

select.nb16 {
    border-radius: 4px;
    padding-right: 2px;
    padding-left: 2px;
    font-weight: 500;
    font-size: 8px;
    line-height: 14px;
    height: 16px;
}

select.nb20 {
    border-radius: 4px;
    padding-right: 6px;
    padding-left: 6px;
    font-size: 9px;
    line-height: 16px;
    height: 20px;
}

select.nb24 {
    border-radius: 6px;
    padding-right: 6px;
    padding-left: 6px;
    font-size: 12px;
    line-height: 18px;
    height: 24px;
}

select.nb30 {
    border-radius: 8px;
    padding-right: 6px;
    padding-left: 6px;
    font-size: 14px;
    line-height: 22px;
    height: 30px;
}

/* colors and gradients for drop-downs  */
select.nbaction {
    /* The blue button color on website */
    background-image: linear-gradient(#4F84BA, #225180);
    background-color: #3C6FA1;
}

select.nbspecialaction {
    /* Darker than the blue button color on website */
    background-image: linear-gradient(#3240DB, #141D87);
    background-color: #1A26AF;
}

select.nbfilter {
    /* lighter than the blue button color on website */
    background-image: linear-gradient(#3DAEAF, #02787A);
    background-color: #039BA0;
}

select.nbnav {
    /* plum */
    background-image: linear-gradient(#8E255F, #60103C);
    background-color: #701346;
    /* almost black */
    /*background-image: linear-gradient(#727272, #2D2D2D);
    background-color: #444444;*/
}

select.nbok {
    /* The green button color on website */
    background-image: linear-gradient(#16A700, #1C6F10);
    background-color: #198609;
}

select.nbcancel {
    /* The red button color on website */
    background-image: linear-gradient(#C70606, #6C0707);
    background-color: #9A0606;
}

select.nbdone {
    /* darker than the green button color on website */
    background-image: linear-gradient(#1A8709, #0E4905);
    background-color: #126006;
}

select.nbattention {
    /* The yellow button color on website */
    background-image: linear-gradient(#FFF800, #F7CD00);
    background-color: #FFE000;
}

select.nbwarning {
    /* dark red */
    background-image: linear-gradient(#912525, #560303);
    background-color: #770404;
}

select.nbdisabled {
    /* The grey button color on website */
    background-image: linear-gradient(#ABABAB, #5A5A5A);
    background-color: #848484;
}

/* hover goes to yellow and changes text color to red.  Disabled one has no hover settings.  attention one is yellow so goes to green with white text */
/*select.nbaction:hover,
select.nbspecialaction:hover,
select.nbfilter:hover,
select.nbnav:hover,
select.nbok:hover,
select.nbcancel:hover,
select.nbdone:hover,
select.nbwarning:hover {
    background-image: linear-gradient(#FFF800, #F7CD00);
    background-color: #FFE000;
    color: #c00000;
    outline: none;
}

select.nbattention:hover {
    background-image: linear-gradient(#16A700, #1C6F10);
    background-color: #198609;
    color: #ffffff;
    outline: none;
}*/

.date-picker {
  width: 170px;
  height: 25px;
  padding: 0;
  border: 0;
  line-height: 25px;
  padding-left: 10px;
  font-size: 12px;
  font-family: Arial, sans-serif;
  font-weight: bold;
  cursor: pointer;
  color: #303030;
  position: relative;
  z-index: 2;
}

.date-picker-wrapper {
  position: absolute;
  z-index: 10000;               /* Important ED 01/26/2021 otherwsie it shows up under modal popup controls */
  border: 1px solid #bfbfbf;
  background-color: #efefef;
  padding: 5px 12px;
  font-size: 12px;
  line-height: 20px;
  color: #aaa;
  font-family: Arial, sans-serif;
  -webkit-box-shadow: 3px 3px 10px rgba(0, 0, 0, 0.5);
          box-shadow: 3px 3px 10px rgba(0, 0, 0, 0.5);
  -webkit-box-sizing: initial;
          box-sizing: initial;
}

.dp-clearfix {
  clear: both;
  height: 0;
  font-size: 0;
}

.date-picker-wrapper.inline-wrapper {
  position: relative;
  -webkit-box-shadow: none;
          box-shadow: none;
  display: inline-block;
}

.date-picker-wrapper.single-date {
  width: auto;
}

.date-picker-wrapper.no-shortcuts {
  padding-bottom: 12px;
}

.date-picker-wrapper.no-topbar {
  padding-top: 12px;
}

.date-picker-wrapper .footer {
  font-size: 11px;
  padding-top: 3px;
}

.date-picker-wrapper b {
  color: #666;
  font-weight: 700;
}

.date-picker-wrapper a {
    color: Navy;
    /*color: #6bb4d6;*/
    text-decoration: underline;
}

.date-picker-wrapper .month-name {
  text-transform: uppercase;
}

.date-picker-wrapper .select-wrapper {
  position: relative;
  overflow: hidden;
  display: inline-block;
  vertical-align: middle;
}

.date-picker-wrapper .select-wrapper:hover {
  text-decoration: underline;
}

.date-picker-wrapper .month-element {
  display: inline-block;
  vertical-align: middle;
}

.date-picker-wrapper .select-wrapper select {
  position: absolute;
  margin: 0;
  padding: 0;
  left: 0;
  top: -1px;
  font-size: inherit;
  font-style: inherit;
  font-weight: inherit;
  text-transform: inherit;
  color: inherit;
  cursor: pointer;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  background: transparent;
  border: 0;
  outline: 0;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=1)";
  filter: alpha(opacity=1);
  opacity: 0.01;
}

.date-picker-wrapper .month-wrapper {
  border: 1px solid #bfbfbf;
  border-radius: 3px;
  background-color: #fff;
  padding: 5px;
  cursor: default;
  position: relative;
  _overflow: hidden;
}

.date-picker-wrapper .month-wrapper table {
  width: 190px;
  float: left;
}

.date-picker-wrapper .month-wrapper table.month2 {
  width: 190px;
  float: left;
}

.date-picker-wrapper .month-wrapper table th, .date-picker-wrapper .month-wrapper table td {
  vertical-align: middle;
  text-align: center;
  line-height: 14px;
  margin: 0px;
  padding: 0px;
}

.date-picker-wrapper .month-wrapper table .day {
  padding: 5px 0;
  line-height: 1;
  font-size: 12px;
  margin-bottom: 1px;
  color: #ccc;
  cursor: default;
}

.date-picker-wrapper .month-wrapper table div.day.lastMonth, .date-picker-wrapper .month-wrapper table div.day.nextMonth {
  color: #999;
  cursor: default;
}

.date-picker-wrapper .month-wrapper table .day.checked {
  background-color: #9cdbf7;
}

.date-picker-wrapper .month-wrapper table .week-name {
  height: 20px;
  line-height: 20px;
  font-weight: 100;
  text-transform: uppercase;
}

.date-picker-wrapper .month-wrapper table .day.has-tooltip {
  cursor: help !important;
}

.date-picker-wrapper .month-wrapper table .day.has-tooltip .tooltip {
  white-space: nowrap;
}

.date-picker-wrapper .time label {
  white-space: nowrap;
}

.date-picker-wrapper .month-wrapper table .day.toMonth.valid {
  color: #333;
  cursor: pointer;
}

.date-picker-wrapper .month-wrapper table .day.toMonth.hovering {
  background-color: #cdecfa;
}

.date-picker-wrapper .month-wrapper table .day.nextMonth, .date-picker-wrapper .month-wrapper table .day.lastMonth {
  display: none;
}

.date-picker-wrapper .month-wrapper table .day.real-today {
  background-color: #ffe684;
}

.date-picker-wrapper .month-wrapper table .day.real-today.checked, .date-picker-wrapper .month-wrapper table .day.real-today.hovering {
  background-color: #70ccd5;
}

.date-picker-wrapper table .caption {
  height: 40px;
}

.date-picker-wrapper table .caption > th:first-of-type, .date-picker-wrapper table .caption > th:last-of-type {
  width: 27px;
}

.date-picker-wrapper table .caption .next, .date-picker-wrapper table .caption .prev {
  padding: 0 5px;
  cursor: pointer;
}

.date-picker-wrapper table .caption .next:hover, .date-picker-wrapper table .caption .prev:hover {
  background-color: #ccc;
  color: white;
}

.date-picker-wrapper .gap {
  position: relative;
  z-index: 1;
  width: 15px;
  height: 100%;
  background-color: red;
  font-size: 0;
  line-height: 0;
  float: left;
  top: -5px;
  margin: 0 10px -10px;
  visibility: hidden;
  height: 0;
}

.date-picker-wrapper .gap .gap-lines {
  height: 100%;
  overflow: hidden;
}

.date-picker-wrapper .gap .gap-line {
  height: 15px;
  width: 15px;
  position: relative;
}

.date-picker-wrapper .gap .gap-line .gap-1 {
  z-index: 1;
  height: 0;
  border-left: 8px solid white;
  border-top: 8px solid #eee;
  border-bottom: 8px solid #eee;
}

.date-picker-wrapper .gap .gap-line .gap-2 {
  position: absolute;
  right: 0;
  top: 0px;
  z-index: 2;
  height: 0;
  border-left: 8px solid transparent;
  border-top: 8px solid white;
}

.date-picker-wrapper .gap .gap-line .gap-3 {
  position: absolute;
  right: 0;
  top: 8px;
  z-index: 2;
  height: 0;
  border-left: 8px solid transparent;
  border-bottom: 8px solid white;
}

.date-picker-wrapper .gap .gap-top-mask {
  width: 6px;
  height: 1px;
  position: absolute;
  top: -1px;
  left: 1px;
  background-color: #eee;
  z-index: 3;
}

.date-picker-wrapper .gap .gap-bottom-mask {
  width: 6px;
  height: 1px;
  position: absolute;
  bottom: -1px;
  left: 7px;
  background-color: #eee;
  z-index: 3;
}

.date-picker-wrapper .selected-days {
  display: none;
}

.date-picker-wrapper .drp_top-bar {
  line-height: 1.4;
  position: relative;
  padding: 10px 40px 10px 0;
}

.date-picker-wrapper .drp_top-bar .error-top, .date-picker-wrapper .drp_top-bar .normal-top {
  display: none;
}

.date-picker-wrapper .drp_top-bar .default-top {
  display: block;
}

.date-picker-wrapper .drp_top-bar.error .default-top {
  display: none;
}

.date-picker-wrapper .drp_top-bar.error .error-top {
  display: block;
  color: red;
}

.date-picker-wrapper .drp_top-bar.normal .default-top {
  display: none;
}

.date-picker-wrapper .drp_top-bar.normal .normal-top {
  display: block;
}

.date-picker-wrapper .drp_top-bar.normal .normal-top .selection-top {
  color: #333;
}

.date-picker-wrapper .drp_top-bar .apply-btn {
  position: absolute;
  right: 0px;
  top: 6px;
  padding: 3px 5px;
  margin: 0;
  font-size: 12px;
  border-radius: 4px;
  cursor: pointer;
  color: #d9eef7;
  border: solid 1px #0076a3;
  background: #0095cd;
  background: -moz-linear-gradient(top, #00adee, #0078a5);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#00adee', endColorstr='#0078a5');
  color: white;
  line-height: initial;
}

.date-picker-wrapper .drp_top-bar .apply-btn.disabled {
  cursor: pointer;
  color: #606060;
  border: solid 1px #b7b7b7;
  background: #fff;
  background: -moz-linear-gradient(top, #fff, #ededed);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#ededed');
}

.date-picker-wrapper .time {
  position: relative;
}

.date-picker-wrapper.single-month .time {
  display: block;
}

.date-picker-wrapper .time input[type=range] {
  vertical-align: middle;
  width: 129px;
  padding: 0;
  margin: 0;
  height: 20px;
}

.date-picker-wrapper .time1 {
  width: 180px;
  padding: 0 5px;
  text-align: center;
}

/*time styling*/
.time2 {
  width: 180px;
  padding: 0 5px;
  text-align: center;
}

.date-picker-wrapper .time1 {
  float: left;
}

.date-picker-wrapper .time2 {
  float: right;
}

.date-picker-wrapper .hour {
  text-align: right;
}

.minute {
  text-align: right;
}

.date-picker-wrapper .hide {
  display: none;
}

.date-picker-wrapper .first-date-selected, .date-picker-wrapper .last-date-selected {
  background-color: #49e !important;
  color: white !important;
}

.date-picker-wrapper .date-range-length-tip {
  position: absolute;
  margin-top: -4px;
  margin-left: -8px;
  -webkit-box-shadow: 0 0 3px rgba(0, 0, 0, 0.3);
          box-shadow: 0 0 3px rgba(0, 0, 0, 0.3);
  display: none;
  background-color: yellow;
  padding: 0 6px;
  border-radius: 2px;
  font-size: 12px;
  line-height: 16px;
  -webkit-filter: drop-shadow(0 0 3px rgba(0, 0, 0, 0.3));
  -moz-filter: drop-shadow(0 0 3px rgba(0, 0, 0, 0.3));
  -ms-filter: drop-shadow(0 0 3px rgba(0, 0, 0, 0.3));
  -o-filter: drop-shadow(0 0 3px rgba(0, 0, 0, 0.3));
  filter: drop-shadow(0 0 3px rgba(0, 0, 0, 0.3));
}

.date-picker-wrapper .date-range-length-tip:after {
  content: '';
  position: absolute;
  border-left: 4px solid transparent;
  border-right: 4px solid transparent;
  border-top: 4px solid yellow;
  left: 50%;
  margin-left: -4px;
  bottom: -4px;
}

.date-picker-wrapper.two-months.no-gap .month1 .next, .date-picker-wrapper.two-months.no-gap .month2 .prev {
  display: none;
}

.date-picker-wrapper .week-number {
  padding: 5px 0;
  line-height: 1;
  font-size: 12px;
  margin-bottom: 1px;
  color: #999;
  cursor: pointer;
}

.date-picker-wrapper .week-number.week-number-selected {
  color: #49e;
  font-weight: bold;
}