/*
    https://chiamakaikeanyi.dev/sizing-in-css-px-vs-em-vs-rem/
    https://stackoverflow.com/questions/609517/why-em-instead-of-px
    https://www.w3schools.com/tags/ref_pxtoemconversion.asp
    https://developer.mozilla.org/en-US/docs/Web/CSS/box-sizing
*/

body
{
    font-size:          16px        !important;     /* Fallback for browsers that do not support the usage of rem */
    font-size:          1.6rem      !important;     /* 10px * 1.6 == 16px */
    margin:             0           !important;
}

footer
{
    font-size:          1.3rem      !important;
}

hr
{
    margin-top:         2rem        !important;
    margin-bottom:      2rem        !important;
}

html
{
    font-size:          62.5%       !important;     /* Assuming the browser font size is set to 16px (i.e. the default)...100% will default 1rem to 16px...62.5% will equate 1rem to 10px...Starting with this as the base simplifies the calculations. */
}

input[type=checkbox]
{
    height:             24px        !important;
    width:              24px        !important;
}

img.width-auto-resize
{
    max-width:          100%;
}

#Div_BodyContent_Main_Button_Create
{
    margin:             0rem 0rem 2rem 0rem;
}

#Div_BodyContent_Main_Content
{
    margin-bottom:      2rem        !important;
}

#Div_BodyContent_Main_Title
{
    margin-bottom:      2rem        !important;
}

.body-text
{
    font-size:          1.4rem      !important;
}

.center
{
    text-align:         center      !important;
}

.dialog-ui-message-box
{
    display:            none;
    vertical-align:     top;
}

.margin-top-1
{
    margin-top:         1rem        !important;
}

.page-help
{
/*  float:              right;  */
}

.page-title-header-text
{
    display:            inline-block;
    float:              left;
    font-size:          2.5rem;
    font-weight:        500;
    line-height:        1.2;
}

.read-more-text-hidden
{
    display:            none;
}

.table-list,
.table-list td,
.table-list th 
{
    border:             1px solid #C0C0C0;
    border-collapse:    collapse;
}

.table-list td,
.table-list th
{
    padding:            6px 6px 6px 6px;
}

.table-list tbody tr
{
    vertical-align:     top;
}

.table-list thead th
{
    vertical-align:     bottom;
}

.table-list tr:nth-child(even)
{
    background-color:   #EFEFEF;
}

.white-space-nowrap
{
    white-space:        nowrap;
}

/**
    Forces the browser to display line breaks and extra white space characters as if you had wrapped the text in <pre></pre> tags (which by default handle white space and line breaks that way).
    - Preserves "\t" and "\n".
    - For More Information See:
    - https://stackoverflow.com/questions/3946688/encoding-a-tab-in-html
    - https://css-tricks.com/almanac/properties/w/whitespace/
*/
.white-space-pre
{
    white-space:        pre;
}

/**
    Forces the browser to display line breaks where they break in code, but extra white space are still stripped/removed.
    - For More Information See:
    - https://css-tricks.com/almanac/properties/w/whitespace/
*/
.white-space-pre-line
{
    white-space:        pre-line;
}

/**
    Forces the browser to display white space characters and line breaks where they break in code, and to also wrap text as needed so it doesn't break out of its parent container.
    - Preserves "\t" and "\n".
    - For More Information See:
    - https://css-tricks.com/almanac/properties/w/whitespace/
*/
.white-space-pre-wrap
{
    white-space:        pre-wrap;
}