/* using html4 doctype declarations will break  window height calculations unless we set height to 100% */
html, body {
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: medium;
    font-style: normal;
    line-height: normal;
    font-weight: normal;
    font-variant: normal;    
    margin: 0;
    padding: 0;
    border: none;
    height: 100%;
}

/* id of top element */
#content {
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-style: normal;
    line-height: normal;
    font-weight: normal;
    font-variant: normal;
    text-align: left;
}

a {
    font-weight: bold;
    color: #006699 !important;
    text-decoration: none;
}

a:hover {
    color: #FF9966 !important;
}

#policy{

}

#policy a {
    cursor: pointer;  
    color: #006699 !important;
}

#policy a:hover {
    color:  #FF9966 !important;
    text-decoration: none;
}

#policy td {
    text-align: justify;
}

#policy h2 {
    color: maroon;
}

.row {
    background-color: papayawhip;
}
.rowImp {
    background-color: papayawhip !important;
}

/* class for boxed element */
.frame {
    border: 1px solid maroon;
    padding: 5px;
}
/* class for boxed element */
.frame-nopad {
    border: 1px solid maroon;
    padding: 0;
    margin: 0 ;
}

.frame-no-result {
    border: 1px solid maroon;
    float:left;
    background:white;
    height: 15em;
    width:50%;
    padding-top: 5em; 
    padding-left: 5em;
}

.picture-frame {
    margin-top: 100px;
    border: 5px solid maroon;
    background-color: white;
    padding: 5px;
}

.picture-noframe {
    margin-left: 20%;
    text-align: right;
    width: 60%;

}
.frame-blue {
    border: 2px solid #006699;
    padding: 5px;
    background: white;
}
.frame-red {
    border: 2px solid #d00407;
    padding: 5px;
    background: white;
}
.frame-pink {
    border: 2px solid deeppink;
    padding: 5px;
    background: white;
}

.frame-green {
    border: 2px solid limegreen;
    padding: 5px;
    background: white;
}

.alternate-rows tr:nth-child(3n){
    background-color:#f8eded;
}


/* nth-child(2n) gives every second column, whilst nth-child(2) gives ONLY the second column */
.alternate-columns td:nth-child(2n){
    background-color: lightgray;
    padding-left: 0.4em;
    padding-right: 0.4em;
}

.second-column-highlight td:nth-child(2){
    background-color: lightgray;
    padding-left: 0.4em;
    padding-right: 0.4em;
}

.no-column-highlight td {
    background-color: white !important;
    padding: 0 !important;
    vertical-align: top !important;
}
.no-column-highlight-padded td {
    background-color: white !important;
    padding: 0 0.4em;
    vertical-align: top !important;
}

.alternate-columns select{
    max-width: 20em;
    min-width: 20em;
}
.second-column-highlight select{
    max-width: 20em;
    min-width: 20em;
}

.no-alternate-columns td:nth-child(2n) {
    background-color: white;
    padding-left: 0.4em;
    padding-right: 0.4em;
}
.no-alternate-columns30 td:nth-child(2n) {
    background-color: white;
    padding-left: 0.4em;
    padding-right: 0.4em;
}

.no-alternate-columns select{
    max-width: 20em;
    min-width: 20em;
}

.no-alternate-columns30 select{
    max-width: 30em;
    min-width: 30em;
}

.input28high {
    box-sizing: border-box;
    height:28px;
}
.max-8em {
    max-width: 8em;
}
.max-10em {
    max-width: 10em;
}
.max-15em {
    max-width: 15em;
}
.max-20em {
    max-width: 20em;
}
.max-25em {
    max-width: 25em;
}
.max-30em {
    max-width: 30em;
}
.max-40em {
    max-width: 40em;
}
.max-50em {
    max-width: 50em;
}
.min-8em {
    min-width: 8em;
}
.min-10em {
    min-width: 10em;
}
.min-15em {
    min-width: 15em;
}
.min-20em {
    min-width: 20em;
}
.min-25em {
    min-width: 25em;
}
.min-30em {
    min-width: 30em;
}
.min-40em {
    min-width: 40em;
}

.width-5em{
    min-width: 5em;
    max-width: 5em;
}
.width-25em{
    min-width: 25em;
    max-width: 25em;
}
.width-35em{
    min-width: 35em;
    max-width: 35em;
}

.width-1em{
    min-width: 1.5em;
    max-width: 1.5em;
}
.width-2em{
    min-width: 2em;
    max-width: 2em;
}
.width-3em{
    min-width: 3em;
    max-width: 3em;
}
.width-4em{
    min-width: 4em;
    max-width: 4em;
}
.width-40em{
    min-width: 40em;
    max-width: 40em;
}
.width-6em{
    min-width: 6em;
    max-width: 6em;
}

.width-8em{
    min-width: 8em;
    max-width: 8em;
}
.width-8em-impt{
    min-width: 8em !important;
    max-width: 8em !important;
}

.width-10em{
    min-width: 10em;
    max-width: 10em;
}

.width-15em{
    min-width: 15em;
    max-width: 15em;
}
.width-18em{
    min-width: 18em;
    max-width: 18em;
}

.width-20em{
    min-width: 20em;
    max-width: 20em;
}

.max-height-10em {
    max-height: 10em;
}

.max-height-15em {
    max-height: 15em;
}

.max-height-20em {
    max-height: 20em;
}

.break-word {
    word-wrap:break-word; 
}

.no-overflow {
    overflow:hidden; 
}

a[href], input[type='submit'],  input[type='reset'],  input[type='button'],  input[type='image'], select, button, .pointer {
    font-family: inherit;
    cursor: pointer;
}

select {
    font-family: inherit;
    font-size: medium;
}

input[type=text]  {
    min-width: 20em;
}

input[type=text].short {
    min-width: 3em;
    max-width: 3em;   
}

textarea, input {
    font-family: inherit;
    color: #006699;
    font-size: medium;   
}


/* id of the the top user menu */

.header {
    text-align: right;
    font-size: smaller;
}
.headerSmall {
    text-align: right;
    
}

.left-title {
    color: maroon;
    text-align: left;
}

.centre-title {
    color: maroon;
    text-align: center;
}

.left-title-indent {
    padding-left: 5%;
    color: maroon;
    text-align: left;
}

.left-title-indent h1, h2, h3, h4 {
    margin:0;

    padding:0;
}

.right-title {
    color: maroon;
    text-align: right;
}

.right-title-indent {
    padding-right: 5%;
    color: maroon;
    text-align: right;
}

.left-indent {
    padding-left: 5%;
    text-align: left;
}

.left-error-indent {
    padding-left: 5%;
    color: deeppink;
    text-align: left;
}

.left-info-indent {
    padding-left: 5%;
    color: limegreen;
    text-align: left;
}

.indent {
    padding-left: 2em;
}

.error {
    color: #d00407;
    font-weight: bold;

}

.highlight {
    color: #FFFF66;
    font-weight: bold;
}

.highlightback {
    background-color: #FFFF66;
    font-weight: bold;
}

.info {
    border: 1px solid maroon;
    text-align: left;
    font-size: smaller;
    vertical-align: top;    
    border-radius: 20px;
    padding: 10px;  
    background-color: #f8eded; 

}

.small {
    font-size: smaller;
}

.info h2  {
    color: maroon;
}

/* for div around a scroll able table */
/* this will centre the scrollable block  */
/* you need to set the hieght and width  */
/* the height might be 500
/* the width could be e.g. 90% */
/* and then make the width of the table below 100% */

.scrollable-centered{
    overflow: auto;
    margin-left: auto;
    margin-right: auto;
    border-style: solid; 
    border-color: lightgrey;
    border-width: 1px;
    background-color: transparent ;
}

.scrollable-centered-noframe{
    overflow: auto;
    margin-left: auto;
    margin-right: auto;
    border-style:none; 
    background-color: transparent ;
}

.scrollable-centered70-noframe{
    overflow: auto;
    margin-left: auto;
    margin-right: auto;
    border-style:none; 
    background-color: transparent ;
    width:70%;
    float:left;
}

.scrollable-centered-blue{
    overflow: auto;
    margin-left: auto;
    margin-right: auto;
    border-style: solid; 
    border-width: 2px;
    border-color: #006699;
    background-color: transparent ;
}

.scrollable-centered-red{
    overflow: auto;
    margin-left: auto;
    margin-right: auto;
    border-style: solid; 
    border-width: 2px;
    border-color: #d00407;
    background-color: transparent ;
}

.noscroll-centered-red{
    overflow: hidden;
    border-style: solid;
    border-width: 2px;
    border-color: #d00407;
    background-color: white;
}

.noscroll-centered-blue{
    overflow: hidden;
    border-style: solid;
    border-width: 2px;
    border-color: #006699;
    background-color: white;
}

.scrollable-centered-blue-on-white{
    overflow: auto;
    margin-left: auto;
    margin-right: auto;
    border-style: solid; 
    border-width: 2px;
    border-color: #006699;
    background-color: white ;
}
.scrollable-centered-blue-on-yellow{
    overflow: auto;
    margin-left: auto;
    margin-right: auto;
    border-style: solid; 
    border-width: 2px;
    border-color: #006699;
    background-color:#FFFF66; 
}

.scrollable-centered-red-on-white{
    overflow: auto;
    margin-left: auto;
    margin-right: auto;
    border-style: solid; 
    border-width: 2px;
    border-color: #d00407;
    background-color: white ;
}

.scrolled-exception {
    color: maroon;
    overflow: auto;
    border-style: solid; 
    border-width: thin;  
    background-color: white ;
    padding: 20px;
    max-width: 1000px;

}

/*----------------------------------------------------------------------------*/
/* lined table */


/* changed the font from just sans-serif on 1/10/14 */
.lined , .linedred
{
    font-family: Verdana, Arial, Helvetica, sans-serif; 
    border-collapse:collapse;
    background-color: white;
}

.lined  td, .lined th 
{

    border:1px solid black;
    padding:3px 7px 2px 7px;
}

 .linedred  td, .linedred th 
{

    border:1px solid maroon;
    padding:3px 7px 2px 7px;
}

.linedentry tr
{
    background-color: white;
    color:black;
    border:solid black thin;

}

.linedentry td 
{

    text-align:center;
    padding-top:5px;
    padding-bottom:4px;
    background-color: white;
    color:black;

}

.lined th 
{

    text-align:left;
    padding-top:5px;
    padding-bottom:4px;
    background-color: #7E7E85;
    color:#fff;
    font-style: italic;

}
.linedred th 
{

    text-align:left;
    padding-top:5px;
    padding-bottom:4px;
    background-color: maroon;
    color:#fff;
    font-style: italic;

}
/*----------------------------------------------------------------------------*/
/* smallprint table */


/* changed the font from just sans-serif on 1/10/14 */
.smallprint 
{
    font-family: Verdana, Arial, Helvetica, sans-serif; 
    border-collapse:collapse;
    background-color: mistyrose;
}

.smallprint  td, .smallprint th 
{

    border:1px solid black;
    padding:3px 7px 2px 7px;
}

 
.smallprint th 
{

    text-align:left;
    padding-top:5px;
    padding-bottom:4px;
    background-color: #7E7E85;
    color:#fff;
    font-style: italic;

}

.top-aligned-cells  td, .top-aligned-cells th  {
    vertical-align: top;
}

.redheader
{
    text-align:left;
    background-color:#7E7E85;
    color:#fff;
    font-family: inherit;
    font-style: italic;
    padding:5px;
}

.redheader th 
{
    text-align:left;
    background-color:#7E7E85;
    color:#fff;
    font-family: inherit;
    font-style: italic;
    padding:5px;
    margin:5px;
}
.maroonbackheader th
{
    text-align:left;
    background-color:maroon;
    color:#fff;
    font-family: inherit;
    font-style: italic;
    padding:5px;
}

.lgreyheader
{
    text-align:left;
    background-color:#c3c3c3;
    color:#fff;
    font-family: inherit;
    font-style: italic;
    padding:5px;
}

.lgreyheader th 
{
    text-align:left;
    background-color:#c3c3c3;
    color:#fff;
    font-family: inherit;
    font-style: italic;
    padding:5px;
    margin:5px;
}

.bottomheavy th {
    border-bottom: 5px solid black !important;
}

.leftheavy {
    border-left: 5px solid black !important;
}

.whiteheader th 
{
    text-align:left;
    background-color:white;
    color:black;
    font-family: inherit;
    font-style: italic;
    padding:5px;
    margin:5px;
}

.blueheader th 
{
    text-align:left;
    background-color:#006699;
    color:#fff;
    font-family: inherit;
    font-style: italic;

    padding:5px 5px 5px 5px;
}

.maroonheader th 
{
    text-align:left;
    background-color:white !important; 
    color:maroon !important; 
    font-family: inherit;
    font-style: italic;
    font-size: larger;
    padding:5px 5px 5px 5px;
}

.lined tr.alt td 
{
    color:#000;
    background-color:pink;
}

.greyed 
{
    background-color:lightgray;    
}

.grey
{
    color:gray;    
}

.white 
{
    background-color:white;    
}

/*----------------------------------------------------------------------------*/
/* sub table */

.subtable 
{
    font-family: sans-serif;
    width:90%;
    text-align: left;
    border-collapse:collapse;
    background-color: mistyrose;
}

.subtable  td, .subtable th 
{

    border:1px solid darkgrey;
    padding:3px 7px 2px 7px;
}

/* ----------------------------------------------------------------------------------*/
/* Link styles */

a {
    font-weight: bold;
    color: #006699;
    text-decoration: none;
}

a:HOVER {
    color: #FF9966;
}

/* ----------------------------------------------------------------------------------*/
/* general classes */

.left-top {
    text-align: left;
    vertical-align: top;
}

.right-top {
    text-align: right;
    vertical-align: top;
}

.top {
    vertical-align: top;
}

.bottom {
    vertical-align: bottom;
}


.right {
    text-align: right;
}

.center {
    text-align: center;
}

.red {
    color: #d00407;
}

.redBorder {
    text-align: left;
    color: #d00407;
    background-color: #c3c3c3;
    border: 3px solid #d00407;
    padding-left: 5px;
    padding-right: 5px;
    padding-top: 20px;
    padding-bottom: 20px;
}

.pageActions {
    text-align: left;
    background-color: whitesmoke;
    padding-left: 10px;
    font-family: Verdana, Arial, Helvetica, sans-serif;
    border: 1px solid black;
}

.pageActionsSHED {
    text-align: left;
    background-color: whitesmoke;
    padding-left: 10px;
    font-family: Verdana, Arial, Helvetica, sans-serif;
    border: 1px solid black;
}
.pageActions td {
    font-size: smaller;
}

.pageActionsHighlight {
    text-align: left;
    background-color:lavenderblush;
    padding-left: 10px;
    font-family: Verdana, Arial, Helvetica, sans-serif;
    border: 1px solid black;
}
.pageActionsHighlight td {
    font-size: smaller;
}

.pageActionsHighlightSHED {
    text-align: left;
    background-color:lavenderblush;
    padding-left: 10px;
    font-family: Verdana, Arial, Helvetica, sans-serif;
    border: 1px solid black;
}

.quickPageActions {     
    text-align: left;
    padding: 0 0 5px 0;
    margin: 0;
    font-family: Verdana, Arial, Helvetica, sans-serif;
}

.quickPageActions  p {
    line-height: 70%;
}

.pageScoring {
    text-align: left;
    background-color:#FFCCFF;
    padding-left: 10px;
    font-family: Verdana, Arial, Helvetica, sans-serif;
    border: 1px solid black;
}

.pageScoring td {
    font-size: smaller;
}


.padded10L  {
    padding: 10px;
    text-align: left;
}

.padded {
    padding: 8px;
    text-align: left;
}

.padded td {
    padding: 6px;
    vertical-align: top;
}

.clickable {
    font-weight: bold;
    color: #006699;
    text-decoration: none;
    cursor: pointer;          
}

.clickable-red {
    font-weight: bold;
    color: #d00407;
    text-decoration: none;
    cursor: pointer;
}

.clickable-tip {
    font-weight: bold;
    color: #006699;
    text-decoration: none;
    cursor: pointer;          
}

.clickable-fake {
	font-weight: bold;
	color: #006699;
	text-decoration: none;         
}
.clickable-fakesmall {
	font-weight: bold;
        font-size: smaller;
	color: #006699;
	text-decoration: none;         
}

.clickable:HOVER {
    color: #FF9966;
}

.clickable-red:HOVER {
    color: #FF9966;
}

.clickable-greyed {
    font-weight: bold;
    color:#777;
    text-decoration: none;
    cursor: not-allowed;
}

.clickable-small {
    font-weight: bold;
    font-size: smaller;
    color:cornflowerblue;
    text-decoration: none;
    cursor: pointer;          
}

.error-small {
    font-weight: bold;
    font-size: smaller;
    color: #d00407;
    text-decoration: none;        
}

.clickable-small:HOVER {
    color: #FF9966;
}

td.clickable:HOVER {
    color: #FF9966;
}

.report {
    font-weight: bold;
    font-size: smaller;
    text-decoration: none;
    cursor: pointer;  
    color:red;
    background-color: #ffddef;
    border: 1px solid red;
    padding:0 5px 1px 5px;
    text-align: center;
    vertical-align: bottom;
    border-radius: 5px;
    box-shadow: 1px 1px 2px #000;     
}
.cagesubmit {
    font-weight: bold;
    font-size: smaller;
    text-decoration: none;
    cursor: pointer;
    color:red;
    background-color: #ffddef;
    border: 1px solid red;
    text-align: center;
    border-radius: 5px;
    box-shadow: 1px 1px 2px #000;
    min-width: 20em !important;
    max-width: 20em !important;
    width: 20em !important;
    min-height:1.8em;
    padding-top: 0.5em;
    display: inline-block;
}
.reportSHED {
    font-weight: bold;

    text-decoration: none;
    cursor: pointer;  
    color:red;
    background-color: #ffddef;
    border: 1px solid red;
    padding:0 5px;
    text-align: center;
    vertical-align: middle;
    border-radius: 30px;
    box-shadow: 1px 1px 2px #000;    
}

.report:HOVER {
    color: #FF9966;
    background-color:#cbfad6;
}
.cagesubmit:HOVER {
    color: #FF9966;
    background-color:#cbfad6;
}
.reportSHED:HOVER {
    color: #FF9966;
    background-color:#cbfad6;
}


/**----------------------------------------------------------------------------*/
/* for assymetric columns */
.left75 {
    width:75%;
    text-align: left;
    padding-left: 0;
    padding-top: 0;
    padding-bottom: 0;
    vertical-align: top;
}
.left100 {
    width:100%;
    text-align: left;
    padding-left: 0;
    padding-top: 0;
    padding-bottom: 0;
    vertical-align: top;
}

.right25 {
    width:25%;
    font-size: smaller;
    text-align: right;
    padding-right: 10px;
    padding-top: 0;
    padding-bottom: 0;

}

#loading {
    background:url("../images/spin.gif") no-repeat center;
    height: 150px; width: 150px;    
    position: fixed; left: 45%; top: 50%; z-index: 1000;
    margin: -25px 0 0 -25px;
}

.bg-blue {
    background-color: rgba(0, 0, 139, 0.2);
    font-size: larger;
}

.bg-lightblue {
    background-color: rgba(173, 216, 230, 0.2);
    font-size: larger;
}

.bg-green {
    background-color: rgba(0, 255, 0, 0.2);
    font-size: larger;
} 

.bg-grey {
    background-color: rgba(130, 130, 130, 0.2);
    font-size: larger;
} 

.bg-orange {
    background-color: rgba(255, 150, 0, 0.2);
    font-size: larger;
}

.bg-pink {
    background-color: rgba(255, 150, 200, 0.2);
    font-size: larger;
}

.bg-red {
    background-color: rgba(255,0,0,0.2);  
    font-size: larger;
} 

.bg-white {
    background-color: rgba(255, 255, 255, 0.2);
    font-size: larger;
} 
.bg-yellow {
    background-color: rgba(255,255,0,0.2); 
    font-size: larger;
}
.bg-mauve {
    background-color: rgba(204, 153, 255, 0.2);
    font-size: larger;
}
.bg-purple {
    background-color: rgba(153, 51, 153, 0.2);
    font-size: larger;
}
.bg-spearmint {
    background-color: rgba(102,255,204,0.2); 
    font-size: larger;
}
.bg-brown {
    background-color: rgba(153,102,0,0.2); 
    font-size: larger;
}

.bg-lime {
    background-color: rgba(153,255,51,0.2); 
    font-size: larger;
}

.bg-NoWingBand {
    color: white;
    background-color: black;
    font-size: larger;
}

.ui-dialog .ui-dialog-titlebar 
{
    height: 40px !important;
    /* TREVOR ADDED */
    font-size: 16px;
}

.ui-dialog .ui-dialog-title
{
    white-space: normal !important/* forces ignore of  text-overflow: ellipsis; */
}

.submit input {

    color: maroon;
    width: 8em;
    font-size: smaller;
    font-weight: bold;
}

.search input{

    color: #006699;
    width: 8em;
    font-size: smaller;
    font-weight: bold;

}

.submit {
    background-color: lavenderblush;
    padding:1em;
    border: 2px solid maroon;
    border-radius: 20px;
    text-align: center;
}

.printwork {
    background-color: #66FFCC;
    padding:1em;
    border: 2px solid darkgreen;
    border-radius: 20px;
    text-align: center;
}

.printwork input{

    color: #006699;
    width: 16em;
    font-size: smaller;
    font-weight: bold;

}

.search {
    background-color:lavender;
    padding:1em;
    border: 2px solid #006699;
    border-radius: 20px;
    text-align: center;
}

.blueWB {
    background:#00008B !important;
    color:white  !important;
}
.lightblueWB {
    background-color: #ADD8E6 !important;
}
.brownWB {
    background:#996600  !important; 
    color:white  !important;
}
.greenWB {
    background:#009900  !important;
    color:white  !important;
}
.greyWB {
    background:#CCCCCC  !important;
}
.mauveWB {
    background: #CC99FF !important;
    color:white !important;
}
.orangeWB {
    background:#FF6600 !important; 
    color:white !important;
}
.pinkWB {
    background:#FFCCFF !important; 
}
.purpleWB {
    background:#993399 !important;
    color:white !important;
}
.redWB {
    background:#FF0000 !important;
    color:white !important;
}
.whiteWB {
    background:#FFFFFF !important; 
}
.yellowWB {
    background:#FFFF66 !important; 
}
.spearmintWB {
    background:#66FFCC !important; 
}
.limeWB {
    background-color: #99FF33 !important; 
}
.NoWingBandWB {
    background:black !important;
    color:white !important;
}

.important {
    background:#FFFF66; 
}

.longtext {
    font-size: smaller;
    word-wrap:break-word;
}

tr.cull td {
    background-color: pink;
}

tr.culledit td {
    background-color:lightgray;
}

.navfloatL{
    width:15em;
    float:left;
    padding-left:1em;
}

.navfloatR{
    float:right;
    padding-right:1em;
}

.floatL6 {
    width:6em;
    float:left;
}

.floatL10 {
    width:10em;
    float:left;
    padding-left:1em;
    padding-bottom:1em;
}

.floatL18 {
    width:18em;
    float:left;
    padding-left:1em;
    padding-bottom:1em;
}
.floatL22 {
    width:22em;
    float:left;
    padding-left:1em;
    padding-bottom:1em;
}

.floatL30 {
    width:30em;
    float:left;
    padding-left:1em;
    padding-bottom:1em;   
}

.floatL35 {
    width:30em;
    float:left;
    padding-left:1em;
    padding-bottom:1em;   
}

.floatL40 {
    width:40em;
    float:left;
    padding-left:1em;
    padding-bottom:1em;   
}
.floatL50 {
    width:50em;
    float:left;
    padding-left:1em;
    padding-bottom:1em;
}

.floatL60 {
    width:60em;
    float:left;
    padding-left:1em;
    padding-bottom:1em;
}

.floatR {
    float:left;
    padding-left:1em;
}

.expired {
    color:gray !important;
    background-color:lightgray !important;
}

.nobreak { white-space: nowrap }

.notop {
    border-collapse: collapse;
    border-top:0 !important;
}

.nobottom {
    border-collapse: collapse;
}

.nobottom td {
    border-bottom:0  !important;
}

/* colours:
RDSVS SCHOOL COLOURS
Corporate colour 1 (Very Dark Blue) Pantone: 282 CMYK 100 68 0 54 RGB: 0 50 95 HTML: #00325f
Corporate colour 2 (Red) Pantone: 199 CMYK: 0 100 62 0 RGB: 193 0 67 HTML: #c10043
e following colours are used on the University website
Light Blue HTML: #EDF2F6
Dark Blue HTML: #00325F
*/

/* because the jqgrid pager bar has a zindex of 101
the dialogs are coming up behind it
.ui-dialog { z-index: 1000 !important ;}
.ui-front { z-index: 1000 !important ;}
 */

.unscrollable-centered-red-on-paleblue{
    overflow-y: visible;
    margin-left: auto;
    margin-right: auto;
    border-style: solid;
    border-width: 2px;
    border-color: #c10043;
    background-color: #EDF2F6;
}

.scrollable-centered-red-on-paleblue{
    overflow: auto;
    margin-left: auto;
    margin-right: auto;
    border-style: solid;
    border-width: 2px;
    border-color: #c10043;
    background-color: #EDF2F6;
}

.unlinedC {
    border-collapse:collapse;
    border: 0;
    margin: 0;
    padding: 0;
}

.unlinedC td {
    border-collapse:collapse;
    border: 0;
    margin: 0;
    padding:0 5px;
    vertical-align: top;
}

.unlinedC td:nth-child(2){
    background-color: lightgray;
    padding-left: 0.4em;
    padding-right: 0.4em;
}


.order-edit-table td:nth-child(1){
    max-width: 30em;
}
.order-edit-table td:nth-child(2){
    background-color: lightgray !important;
    padding-left: 0.4em;
    padding-right: 0.4em;
    max-width: 30em;
}
.order-edit-table td:nth-child(3){
    padding-left: 0.4em;
    padding-right: 0.4em;
}
.order-edit-table select, text {
    max-width: 25em;
    min-width: 25em;
}

.edit {
    font-weight: bold;
    font-size:small;
    font-style: normal !important;
    text-decoration: none;
    cursor: pointer;
    color:#c10043;
    background-color: #ffddef;
    border: 2px solid #c10043;
    padding:0.3em 2em 0.5em 2em;
    text-align: center;
    vertical-align: bottom;
    border-radius: 6px;
    box-shadow: 1px 1px 2px #000;
    margin-right: 0.4em;
}

.editDisabled {
    font-weight: bold;
    font-size:small;
    font-style: normal !important;
    text-decoration: none;
    cursor: not-allowed;
    color:#c10043;
    background-color: lightgray;
    border: 2px solid #c10043;
    padding:0.3em 2em 0.5em 2em;
    text-align: center;
    vertical-align: bottom;
    border-radius: 6px;
    box-shadow: 1px 1px 2px #000;
    margin-right: 0.4em;
}

.edit:hover {
    background-color: hotpink;
    color:white;
}

.editR {
    font-weight: bold;
    font-size:small;
    font-style: normal !important;
    text-decoration: none;
    cursor: pointer;
    color:#ffddef;
    background-color: #c10043;
    border: 2px solid #ffddef;
    padding:0.3em 2em 0.5em 2em;
    text-align: center;
    vertical-align: bottom;
    border-radius: 6px;
    box-shadow: 1px 1px 2px #000;
    margin-right: 0.4em;
}

.editR:hover {
    background-color: hotpink;
    color:white;
}

.editY {
    font-weight: bold;
    font-size:small;
    font-style: normal !important;
    text-decoration: none;
    cursor: pointer;
    color:#c10043;
    background-color: #ffd263;
    border: 2px solid #c10043;
    padding:0.3em 2em 0.5em 2em;
    text-align: center;
    vertical-align: bottom;
    border-radius: 6px;
    box-shadow: 1px 1px 2px #000;
    margin-right: 0.4em;
}

.editY:hover {
    background-color: hotpink;
    color:white;
}

.editG {
    font-weight: bold;
    font-size:small;
    font-style: normal !important;
    text-decoration: none;
    cursor: pointer;
    color:#c10043;
    background-color: #b1f3aa;
    border: 2px solid #c10043;
    padding:0.3em 2em 0.5em 2em;
    text-align: center;
    vertical-align: bottom;
    border-radius: 6px;
    box-shadow: 1px 1px 2px #000;
    margin-right: 0.4em;
}

.editG:hover {
    background-color: hotpink;
    color:white;
}

.smalledit {
    font-weight: bold;
    font-size:10px;
    font-style: normal !important;
    text-decoration: none;
    cursor: pointer;
    color:#c10043;
    background-color: #ffddef;
    border: 1px solid #c10043;
    padding:0.2em 0.5em;
    text-align: center;
    vertical-align: middle;
    border-radius: 4px;
    box-shadow: 1px 1px 2px #000;

}

.smalledit:hover {
    background-color: hotpink;
    color:white;
}

.bigcell {
    max-height:4em;
    max-width:inherit;
    white-space:normal;
}

.disabled  {
    background-color: transparent !important;
    padding: 0.2em;
    overflow: auto;

    color:black !important;
    border: 1px solid #CCCCCC !important;
}