/* template.css - a css template                                                                                     */
/* started - 17-May-2022                                                                                             */
/* References:                                                                                                       */
/*         HTML & CSS for Beginners Part 22: How to create a basic layout - the CSS                                  */
/* Log                                                                                                               */
/*     20-May-2022 - started                                                                                         */
/*     30-Sep-2023 - add message styling                                                                             */
/*     24-Oct-2023 - renamed from d_template.css to template.css                                                     */
/*     18-Dec-2024 - reformat for foldering                                                                          */
/*     19-Jun-2025 -- add global selector * and box-sizing                                                           */

*.
*::before,
*::after
{
    box-sizing: border-box;
}

#heading-div 
{
    width: 80%;
    margin: auto;
    margin-top: 5px;
    margin-bottom: 5px;
    max-width: 800px;
    text-align: center;
}

#section1-div 
{
    width: 80%;
    margin: auto;
    margin-top: 5px;
    margin-bottom: 5px;
    max-width: 800px;
    text-align: left;
}

#section2-div 
{
    width: 80%;
    margin: auto; 
    margin-top: 5px;
    margin-bottom: 5px;
    max-width: 800px;
    text-align: left;
}

#first-ordlist 
{
    text-align: left;
}

#seoond-ordlist 
{
    text-align: left;
}

#message-div 
{
    width: 80%;
    margin: auto;
    margin-top: 15px;
    margin-bottom: 5px;
    max-width: 800px;
    text-align: left;
}

#message-label 
{
    display: inline-block;
    width: 80px;
}

#message-input 
{
    background-color: gainsboro;
    border-width: 1px;
    width: 80%;
}

#help-div
{
    width: 80%;
    margin: auto;
    margin-top: 15px;
    margin-bottom: 5px;
    max-width: 800px;
    text-align: left;
    display: none;
}