/* ===========================================
   html elements */

    html, body{
        width:              100%;
        height:             100%;
        margin:             0;
        font-family:        verdana, sans-serif;
        font-size:          16px;
    }

    h1{}
    h2{}
    h3{}
    h4{}
    h5{}
    h6{}

    table{ border-collapse: collapse; }
    table tr.middle td{ vertical-align: middle; }

    td{ 
        vertical-align: top;
        padding:        0;
    }

    img{ border: none; }

    a{}
    a:hover{}
    a:visited{}
    
    p{ margin-top: 0; }
    
    .bold{ font-weight:bold; }
    
    .noborder{ border: none; }

    .bold{ font-weight:bold; }
    .italic{ font-style: italic; }
    .underline{ text-decoration: underline; }

/* ===========================================
   list elements */

    ul{
        list-style-type:        disc;
        list-style-position:    outside;
        margin-top:             0;
    }

    ol{
        list-style-type:        decimal;
        list-style-position:    outside;
        margin-top:             0;
    }

    li{ margin-bottom: .5em; }

    dl{}
    dt{}
    dl{}

/* ===========================================
   form elements */

    form{ margin: 0px; }
    input{}
    input.middle{ vertical-align: middle; }
    select{}
    option{}

/* ===========================================
   html extensions */

    /* ul.custom is for including your own symbol inside <li> rather than using the standard markers */
    ul.custom{ list-style-type: none; }
    ul.custom-align{ list-style-type: none; margin-left: 0; padding-left: 0; }
    ul.custom li, ul.custom-align li{ margin-left: 0px; padding-left: 1em; text-indent: -1em; }

    /* these get you close but will have to be tweaked for various font sizes*/
    ul.align{ margin-left: -2em; }
    ol.align{ margin-left: -1.3em; }

    ul.nomarker{ list-style-type: none; }
    ul.nomarker-align{ list-style-type: none; margin-left: 0; padding-left: 0; }

/* ===========================================
   positioning */

    .floats{
        overflow:   hidden;
        width:      100%;
    }
    
    .clear{ clear: both; }

    .left{ float: left; }
    .right{ float: right; }
    
    .relative{ position: relative; }
    .absolute{ position: absolute; }

    .block{ display: block; }

    table.center-vertical{ margin: 0em; }
    table.center-vertical td{ vertical-align: middle; }

    table.center-horizontal{ width:100%; margin: 0em; }
    table.center-horizontal td{ text-align: center; }
    
    div.center-horizontal{ margin-left:auto; margin-right:auto; }

/* ===========================================
   debugging */
   
   .outline{ border:1px solid red; }