/*  Stylesheet for Layout
    Kyu Hur
    February 16, 2020
*/

.ModuleBar      { background:#71c9f8; width: 162px; font-family: sans-serif; font-size: 12pt; text-align: center; color:black; margin:0px; padding:2px; height:20px; border:1px solid white; border-radius:5px; }
.MenuBar        { font-family: sans-serif; font-size: 12pt; color:black; margin:4px; padding:2px; width:156px; height:22px; border-radius:5px; }
.MenuBar:hover  { background:#fffcbc; color:blue; font-weight: bold; }
.MenuBarSelected { background:#fffcbc; font-family: sans-serif; font-size: 12pt; color:blue; margin:4px; padding:2px; width:156px; height:22px; border-radius:5px; }
.SectionBar     { background:#71c9f8; width: auto; font-family: sans-serif; font-size: 10pt; padding: 5px; box-sizing: border-box; border-radius: 5px; }
.SectionData    { width: 100%; }

.LabelBar       { font-family: sans-serif; font-size: 8pt; font-weight: bold; padding: 5px; box-sizing: border-box; border:1px solid #71c9f8; border-radius: 5px; }
.LabelBar:hover { background:#fffcbc; }

.PageBlock      { width:100%; height:24px; font-family: sans-serif; font-size: 8pt; text-align: center; vertical-align: middle; }
.PageBlock .PageButtonActive    { background:#71c9f8; float:left; margin-right: 2px; padding:2px; border-radius:5px; border: 1px solid transparent; }
.PageBlock .PageButtonInactive  { background:#cbe8f8; float:left; margin-right: 2px; padding:2px; border-radius:5px; border:1px solid #71c9f8; color: gray; }
.PageBlock .PageSelect  { background:#71c9f8; float:left; margin-right: 2px; padding:2px; border-radius:5px; border: none; font-family: sans-serif; font-size: 8pt; }

.Table          { display: table; border-spacing: 0 2px;}
.TableHeader    { display: table-row; background:#cbe8f8; }
.TableRow       { display: table-row; }
.TableRow:hover { background:#faf6b3; }
.TableRowMute   { display: table-row; }
.TableCell      { display: table-cell;  padding: 2px 4px 2px 4px; white-space: nowrap; }
.TableCellTight { display: table-cell;  padding: 0 1px 0 1px; white-space: nowrap; }

#input_block    { float: left; padding: 0 2px 0 2px; }
#input_block_stop { clear: left; height: 0; }

.FilterElement  { margin-left: 5px; padding: 2px; }

.ListWidthIcon  { width: 20px;  resize: none; }
.ListWidthThumbnail { width: 32px;  resize: none; }

button, input, select, textarea { font-family: sans-serif; font-size: 10pt; }
.ImageButton { background:#fffcbc; padding: 4px; border-radius:4px; }
.SmallData  { font-family: sans-serif;  font-size: 8pt; }
.ListHeader { font-family: serif;       font-size: 8pt; }
.ListSort   { font-family: serif;       font-size: 8pt; }
.ListSort:hover { background:#fffcbc; }
.ListData   { font-family: sans-serif;  font-size: 10pt; }
.FieldName  { font-family: serif;       font-size: 8pt; }
.FieldData  { font-family: sans-serif;  font-size: 10pt; }
.TitleText  { font-family: sans-serif;  font-size: 12pt; font-weight: bold; text-align: center; }

.Truncate { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.Left { text-align: left; }
.Center { text-align: center; }
.Right { text-align: right; }

.BGBlockHeader { background:#71c9f8; }
.BGReadOnly { background-color: #dddddd; }
.Red    { color: red; }
.Blue   { color: blue; }
.Green  { color: green; }
.DarkGray { color: #555555; }

.Modal { display: none; position: fixed; z-index: 1; padding-top: 100px; left: 0; top: 0; width: 100%; height: 100%; overflow: auto; background-color: rgba(0,0,0,0.5); }
.ModalBox { background-color: #fefefe; margin: auto; vertical-align: middle; position: relative; border: 1px solid #888; border-radius:10px; }
.ModalBox .ModalTitle { color: white; background-color: black; width: 100%; padding: 10px 0 10px 0; border-top-left-radius: 10px; border-top-right-radius: 10px; }
.ModalBox .ModalData { padding: 10px; }