/*======================================================================
DATA ENTRY SCREEN
======================================================================*/

/* ========== Main Data Entry Screen Frame ==========  */

.GalScr {
  background-color: lightyellow;
  border: 2px solid sienna; 
  display: block;
  height: auto;
  position: center;
  margin: 3px;
}

/* ========== Section Titles for Data Entry - Main and Detail Lines ==========  */

.ScreenHd {
  background-color: white;
  font: 18px Verdana, sans-serif;
  border: 1px solid sienna; 
  color: sienna;
  margin: 2px;
  padding-top: 5px;
  text-align: center;
  width: auto;
  height: 50px;
  font-weight: bold;
}

.ScreenHd-A {
  border-top: none; 
  border-left: none; 
  border-right: none;
  border-bottom: 1px solid sienna; 
  width: 100%;
  margin: 0px;
}

/* ========== Default Frame for Header Data Entry Section ==========  */


.ScreenEntry {
  background-color: lightyellow;
  font: 14px verdana, sans-serif;
  border: none;
  color: black;
  height: auto; 
  padding: 0px;
}

/* ========== Default bootstrap grid row setting for data entry on header screen ==========  */

.row {
  border: 1px sienna;
  font: 14px Verdana, sans-serif;
  background-color: lightyellow;
  height: auto;
  margin: 0px;
  padding: auto;
}

/* ========== blank row format for inserting in header screen ==========  */

.row-blank {
  background-color: lightyellow;
  border: none;
  height: 15px;
}

/* ========== Data Input - Main and Detail Lines - Entry fields and Display-Only fields (-D) ==========  */

.inpClass-D, .inpClass, .inpClass-Dtl { /* Data Entry - Detail */
  background-color: moccasin;
  color: black;
  font: 14px Verdana, sans-serif;
  border: 1px solid white;
  height: 24px;
  margin: 0px;
  padding: 0px;
  padding-bottom: 3px;
  margin-left: 10px;
}

.inpClass-Dtl {  /* Data Entry - Detail */
  border: none; 
  margin: 0px;
  padding: 0px;
}

.inpClass-Err {  /* Data Entry - Detail */
  background-color: red;
}

.inpClass-NoErr {  /* Data Entry - Detail */
  background-color: moccasin;
}

.inpClass-D {
  background-color: lightyellow;   /* Disabled */
}

.Number-right {text-align: right;}

input:focus {
  border: 1px white;
  background-color: moccasin;
}

.inpLab {
  font: 14px Verdana, sans-serif;
  border: 1px solid lightyellow;
  height: 24px;
  float: left;
  left: 10px;   /* Disabled */
  margin: 0px;
  padding: 0px;
}

/* ========== Buttons on Input Screen for additional user interaction and help 
 These buttions are specified in excel ==========  */

.ScrBtn {
  background-color: lightblue;
  border: 1px solid white;
  color: black;
  text-align: center;
  display: inline-block;
  font: 14px Verdana, sans-serif;
/*  float: left; */
  height: 24px;
  cursor: pointer;
}

.ScrBtn:hover,
.ScrBtn:focus
{
  background-color: white;
}
/* ========== Buttons on Data Entry Screen for Navigation ==========  */

.gbtn button, .gbtnm button {
  background-color: lightyellow; 
  border: 1px sienna;
  color: black;
  text-align: center;
  display: inline-block;
  font-size: 16px;
  margin: 2px;
  margin-left: 10px;
  vertical-align: middle;
  padding: 3px;
}

/* ========== Buttons on Browse Window for Navigation ==========  */

.gbtnm button {
  margin-right: 10px;
  float: right;
}

.gbtnr button {
  margin-right: 10px;
  float: left;
  width: 200px;
  text-align: left;
}

.gbtnb button {
  margin-left: 10px;
  display: block;
  width: 100px;
}


.gbtn button:hover, .gbtnm button:hover {background-color: orange; color: black;}

.scrollable1
{
    min-height: 0px;
    max-height: 200px;
    overflow-y: auto;
    margin-left: 30px;
}  

/* ========== Box for graphs ==========  */

.Gspan {
  display: inline-block; /* the default for span */
  width: 400px;
  height: 400px;
  padding: 2px;
  border: 2px solid sienna;
  margin: 10px;
  background-color: lightyellow;
  float: left; 
}

.InpSpan {
  margin: 5px;
  border: 1px solid sienna;
  border-radius: 10px;
}

.GspanI {
  position: fixed; /* Stay in place */ 
  z-index: 1; /* Sit on top */
  padding-top: none; /* Location of the box */
  left: 30px;
  top: 30px;
  width: 40%; /* Full width */
  overflow: auto;
}

.Hline {
  border-top: 1px solid sienna;
  height: 2px;
  padding: 0px;
  margin: 6px 0px;
  width: 100%;
}

.inpRadio {
  padding: 0px;
  margin: 10px;
  margin-top: 25px;
  margin-bottom: 0px;
  width: 10px;
}

.TableTitle {
  background-color: sienna;
  text-align: center;
  color: white;
}

.TableFooter {
  background-color: lightblue;
  text-align: right;
  color: black;
}

/*======================================================================
Detail Tables - Browse Box, LOV, and Detail Line Entry
======================================================================*/


/*  

LOV 

0. Parent Window Tscr
1. LOV-modal - modal window
2.  LOV-content
3.    LOV-body
4.      LOV-title - title showing no of records
5.      LOV-close - button to close the window
6.      LOV-help  - help table #LOV-helpwin
7.      Search input string
8.      gbtnm - close button
9.  #LOV-helpwin    under LOV-body
10. #LOV-helpheader under #HelpTable
11. #LOV-helpbody   under #HelpTable

Browse Window

0. Parent Division - BrowDiv
1. Brow-Win - main frame browse window #BrowBox
2.  LOV-content
3.    LOV-body
4.      LOV-title - title showing no of records
5.      LOV-close - button to close the window
6.      LOV-help  - help table #Brow-tabwin
7.      Search input string
8.      gbtnm - common button class for navigation
9.  #Brow-tabwin      under LOV-body
10. #Brow-tabheader under #Brow-tabwin
11. #Brow-tabbody   under #Brow-tabwin

*/

.LOV-modal {
  border:  2px solid sienna;
  display: show; /* Hidden by default */
  position: fixed; /* Stay in place */ 
  z-index: 1; /* Sit on top */
  padding-top: none; /* Location of the box */
  left: 30px;
  top: 30px;
  width: 40%; /* Full width */
  min-height: 10%;
  max-height: 80%;
/*  overflow: auto; /* Enable scroll if needed */
  background-color: green; /* Fallback color */
  background-color: rgba(0,0,0,.4); /* Black w/ opacity */
  font: 16px Verdana, sans-serif;  
}

.Brow-Win {
  border:  2px solid sienna;
  display: show; /* Hidden by default */
  padding: none; /* Location of the box */
  margin: auto; 
  margin-top: 30px;
  width: 95%; /* Full width */
  background-color: white; /* Fallback color */
  background-color: rgba(0,0,0,.4); /* Black w/ opacity */
  font: 16px Verdana, sans-serif;
  overflow-x: auto;  
}

.LOV-content {
  background-color: oldlace; 
  padding: 10px;
  border: 1px solid sienna;
  width: 100%;
}

.LOV-content1 {
  padding: 2px;
  width: auto;
  margin-left: 10px;
}

.LOV-content2 {
  border: none;
  padding: 2px;
  width: auto;
  display: inline;
  margin-left: 10px;
}

.LOV-body {
  padding: 10px;
  border: 1px solid sienna;
  width: auto;
  overflow-x: auto;
}

.LOV-records {
  padding: 2px;
  border: none;
  color: sienna;
  text-align: left;
  width: 40%;
}

.LOV-title {
  padding: 2px;
  border: none;
  font: 18px Verdana, sans-serif;
  font-weight: bold;
  color: sienna;
  text-align: left;
  width: 60%
}

.LOV-help tr, .LOV-help th, .LOV-help td, .LOV-body tr, .LOV-body td {
  border: 1px solid white;
  padding: 2px 2px 2px;
  font: 14px Verdana, sans-serif;
  word-break: normal;
}

.LOV-help {border: 2px solid sienna;}
.LOV-help tr {color: white; background-color: sienna; text-align: center;}

#LOV-helpbody {
  display: block;
  height: 100%;
  max-height: 300px;
  overflow-y: scroll;
}

#LOV-helpbody tr, #Brow-tabbody tr, #Rep-tabbody tr {color: black; background-color: wheat; text-align: left;}
#LOV-helpbody tr:nth-child(even), #Brow-tabbody, #Rep-tabbody tr:nth-child(even) {background-color: lemonchiffon;}
#LOV-helpbody tr:hover, #Brow-tabbody tr, #Rep-tabbody tr:hover {color: black; background-color: burlywood;}

/*   detail line entries 

Parent division of table ----- Class: LOV-body / Detl-Win      ----- Id: NONE / TmDivB
Table Element            ----- Class: LOV-help / Detl-Table    ----- id: LOV-helpwin / MyTableB
Table Header             ----- Class: Table-Header / Detl-Head ----- id: LOV-helpheader / Detl_HeadB
Table Body               ----- Class: Table-Body / Detl-Body   ----- id: LOV-helpbody / Detl_BodyB

*/

.Detl-Win {
  border:  none;
  display: show; /* Hidden by default */
  padding: 0px; /* Location of the box */
  margin: 1px;
  width: auto; /* Full width */
  background-color: white; /* Fallback color */
  font: 14px Verdana, sans-serif;
  max-height: 30%;
 }

.Detl-Table tr, .Detl-Table th, .Detl-Table td, .Detl-Win tr, .Detl-Win td {
  border: 1px solid white;
  padding: 0px;
  font: 14px Verdana, sans-serif;
  word-break: normal;
}

.Detl-Table {
display: block;
border: none; 
margin: 0px;
}

.Detl-Body {
  display: block;
  max-height: 100px;
  overflow-y: auto;
}


.Detl-Head {
  display: block;
}


.Detl-Table tr {color: white; background-color: sienna; text-align: center; height: 24px; border: none;}


/* Detail Table Body Class */




.Detl-Body tr, .Detl-Body td {color: black; background-color: wheat; text-align: left; height: 24px;}
.Detl-Body tr:nth-child(even) {background-color: lemonchiffon;}
.Detl-Body tr:hover {color: black; background-color: burlywood;}


/* Detail Table Body Identifier */

/*
#Detl-Body {
  display: block;
  max-height: 100px;
  overflow-y: scroll;
}

#Detl-BodyB tr, #Detl-BodyB td {color: black; background-color: wheat; text-align: left; height: 24px;}
#Detl-BodyB tr:nth-child(even) {background-color: lemonchiffon;}
#Detl-BodyB tr:hover {color: black; background-color: burlywood;}

*/

/************************************************************************

Styles for Display of Records in a frame

*************************************************************************/

/* Overall Display body  */

.Disp-body {
  font: 18px Verdana, sans-serif;
}

/* Display Frame - Outside Frame, Inner Division, and and Menu Options for Reports  */

.Disp-frameG {
  padding: 0px;
  border: 1px solid sienna;
  overflow: none;
  margin: 3px;
  display: block;
  float: left;
 }

.Disp-frameB {
  padding: 5px;
  border: 1px solid sienna;
  display: block;
  margin: auto;
  margin-top: 50px;
  width: 80%;
 }

.Disp-frameL {
  position: fixed; /* Stay in place */ 
  padding: 5px;
  border: 1px solid sienna;
  display: block;
  margin-top: 50px;
  margin-left: 25%;
  width: 60%;
  z-index: 1; /* Sit on top */
  background-color: rgba(255,255,255,1);
 }

.Disp-frameV {
  padding: 2px;
  border: 1px solid sienna;
  display: block;
  margin-left: 20%;
  width: auto;
  position: fixed; /* Stay in place */ 
  z-index: 1; /* Sit on top */
  background-color: rgba(255,255,255,1);
 }

.Disp-frameR {
  padding: 5px;
  border: 1px solid sienna;
  display: inline-block;
  float: left; 
  margin: 10px;
  margin-top: 20px;
  width: 80%;
 }

.Disp-frameS {
  margin: 0px;
  padding: 0px;
  border: none;
  display: inline-block;
  float: left; 
  width: 100%; 
  overflow: none;
 }

.Disp-options {
  padding: 10px;
  margin: 10px;
  padding-top: 0px;
  border: 1px solid sienna;
  width: 230px;
  height: auto;
  display: inline-block;
  float: left;
  height: 500px;
  overflow: auto;
}

/* Display Frame - Buttons for Report Options, Report Option Heading, and Buttons for Actions  */

.GspanI button,
.Disp-options button, .Disp-frame button, 
.Disp-frameS button, .Disp-frameG button {
  background-color: burlywood; 
  border: none;
  color: black;
  font-size: 16px;
  margin: 3px;
  vertical-align: middle;
  padding: 5px;
  height: auto;
}

.Disp-options button {
  float: left;
  width: 200px;
  text-align: left;
}

.Disp-blocks button {
  margin-right: 3px;
  font-size: 16px;
  float: left;
  width: 250px;
  text-align: center;
  padding: 1px;
}

#Rprocd {
  color: black;
  text-align: center;
  background-color: burlywood;
  position: sticky;
  padding-left: 10px;
  padding-right: 10px;
  margin-right: 5px;
  margin-bottom: 5px;
  font: 18px Verdana, sans-serif;
}

#Disp-optionsT {
  color: white;
  text-align: center;
  background-color: sienna;
  font-size: 18px;
  position: sticky;
  margin-top: 0px;
  top: 0;
}

.GspanI button,
.Disp-actions button {
  margin-right: 10px;
  margin-top: 12px;
  float: right;
  text-align: center;
  border-radius: 4px;
  padding: 1px;
  background-color: lightyellow;
  border: 1px solid sienna;
  color: sienna;
}

#Proceed {


}


.Disp-options button:hover, 
.Disp-actions button:hover {background-color: lightblue;}

/* Display Title */

.Disp-title {
  padding: 3px;
  border: none;
  font: 18px sans-serif;
  font-weight: bold;
  color: black;
  float: left;
  display: inline;
  margin-left: 20px;
}

/* Use Inputs for Reports, Search, and for Browse Advance Search - Labels and input fields */

.Disp-inputL {
  border: none;
  padding: 2px;
  display: inline;
  margin-left: 10px;
}

.Disp-inputD {
  margin: : 5px;
  padding: 2px;
  width: auto;
  display: inline;
  margin-left: 0px;
}

.Disp-inputF {
  background-color: moccasin;
  color: black;
  font: 14px Verdana, sans-serif;
  border: 1px solid white;
  height: 24px;
  margin: 0px;
  padding: 0px;
  margin-left: 10px;
  display: inline;
}

.Disp-label,
.Disp-search {
  padding: 2px;
  border: none;
  font: 14px Verdana, sans-serif;
  font-weight: bold;
  color: sienna;
  float: left;
  display: inline;
  margin-left: 50px;
}

.Disp-search {
  margin-left: 10px;
  font-weight: normal;
  background-color: lightyellow;
  border: 1px solid sienna;
  margin-top: 4px;
  display: block;
}

/* Table, Header, Body, Rows, and Cells */

.Disp-table {
  margin: 0px 5px 5px 5px;
  padding: 0px 2px 2px 2px;;
  border: 1px solid sienna;
  position: relative;
  max-height: 300px;
  width: 99%;
  overflow: auto;
  border-collapse: collapse;
  display: inline-block;
}

.Disp-tablebody 
{
  width: 100%;
  margin: 0px;
}


.Print-table {
  margin: 10px 5px 5px 5px;
  padding: 0px;
  border: 1px solid sienna;
  width: 98%;
  border-collapse: collapse;
  height: auto;
}

.MyQuery button {
  position: sticky;
  background-color: lightgreen;
  top: 10px; 
}

.MyQueryE {
  position: sticky;
  top: 200px; 
  background-color: lightskyblue;
  width: 480px;
  height: 200px;
}

.Disp-table th {
  position: sticky;
  text-align: center;
  top: 0; 
}

.Disp-boxT {
color: sienna;
font-weight: bold;
}

.Disp-table th {
  position: sticky;
  bottom: 0;
}

.Disp-tablebody tr, .Disp-tablebody th, .Disp-tablebody td {
  padding: 0px 1px 1px 1px;
  font: 14px Verdana, sans-serif;
  word-break: normal;
  background-color: lemonchiffon;
}

.Disp-tablehead th {text-align: center;}

.Disp-tablebody td, .Disp-tablehead th, .Disp-tablefoot th {
  border: 1px solid white;
}

.Disp-tablebodyR tr:nth-child(even) td {background-color: wheat;}

.Disp-tablebodyS td {background-color: red;}

.Disp-tablefoot tr, .Disp-tablefoot th, .Disp-tablefoot td, 
.Disp-tablehead tr, .Disp-tablehead th, .Disp-tablehead td {
  color: white; 
  background-color: sienna; 
  padding: 2px;
  font: 14px Verdana, sans-serif;
  word-break: normal;
  text-align: center;
}

.Disp-tablefoot tr, .Disp-tablefoot th, .Disp-tablefoot td {
  background-color: burlywood; 
} 

/* TRIAL CLASSES =====================================================*/

.w3-theme-l5 {color:#000 !important; background-color:#f8fcfe !important}
.w3-theme-l4 {color:#000 !important; background-color:#e7f5fb !important}
.w3-theme-l3 {color:#000 !important; background-color:#d0ecf7 !important}
.w3-theme-l2 {color:#000 !important; background-color:#b8e2f3 !important}
.w3-theme-l1 {color:#000 !important; background-color:#a1d9ef !important}
.w3-theme-d1 {color:#000 !important; background-color:#69c2e6 !important}
.w3-theme-d2 {color:#fff !important; background-color:#4ab6e0 !important}
.w3-theme-d3 {color:#fff !important; background-color:#2aa9db !important}
.w3-theme-d4 {color:#fff !important; background-color:#2092bf !important}
.w3-theme-d5 {color:#fff !important; background-color:#1b7a9f !important}

.w3-theme-light {color:#000 !important; background-color:#f8fcfe !important}
.w3-theme-dark {color:#fff !important; background-color:#1b7a9f !important}
.w3-theme-action {color:#fff !important; background-color:#1b7a9f !important}

.w3-theme {color:#000 !important; background-color:#87ceeb !important}
.w3-text-theme {color:#87ceeb !important}
.w3-border-theme {border-color:#87ceeb !important}

.w3-hover-theme:hover {color:#000 !important; background-color:#87ceeb !important}
.w3-hover-text-theme:hover {color:#87ceeb !important}
.w3-hover-border-theme:hover {border-color:#87ceeb !important}

.w3-font-12 {font: 12px Arial, sans-serif}
.w3-font-14 {font: 14px Arial, sans-serif}
.w3-font-16 {font: 16px Arial, sans-serif}
.w3-font-18 {font: 18px Arial, sans-serif}
.w3-font-20 {font: 20px Arial, sans-serif}
.w3-font-22 {font: 22px Arial, sans-serif}
.w3-font-24 {font: 24px Arial, sans-serif}

.NextDiv {
height: auto;
width: 90%;
border: 1px solid blue;
color: black;
opacity: 1;
}

.Ico button {
margin: 10px; 
color: sienna; 
float: right; 
background-color: lightyellow;
border: 1px solid sienna;
display: inline-block;
padding: 2px;
height: 25px;
width: 30px;
}

/*          MIS classes           */

.MISfrm {
border: 1px solid blue;
border-radius: 15px;
background-color: lightblue;
width: 90%;
height: auto;
display: block;
margin: auto;
margin-top: 50px;
}

.MISgraph {
border: 1px solid darkblue;
border-radius: 15px;
background-color: white;
width: 46%;
height: 380px;
margin: 20px;
display: inline-block;
overflow: auto;
}