body,
    html {
        margin:0;
        padding:0;
        color:#000;
        background-color: white;
        font-family: Lato, Arial, Verdana ;
    }
    
 /*   h1 {
        margin:0;
        font-size: 1.5em;
    }
 */   
    h2 {
        margin-left: 10px;
        margin-top: 0;
    }

    h3 {
        font-size: 1em;

    }
    

    pre {
        background-color: #E9E9E9;
    }

    canvas { 
        border: 1px solid black; 
        margin-left: auto;
        margin-right: auto;
    }    

    input .intxt{
        float: right;
    }
    
    #container {
        position: relative;
        width:1000px;
        margin:0 auto;
        background: white;
        font-family: Lato, serif;    
    }
    #header {
        padding:5px 10px;
        background:#000000;
        color: white;
        font-family: 'Palatino';
        text-align: center;
    }

    #header h1{
        font-size: 1.5em;
        font-family: "Palatino";
        padding: 10px;

    }
    #header h2{
        font-size: 1.2em;
        font-family: "Times New Roman";
        font-style: italic;
    }    
    
    #nav ul {
        margin:0;
        padding:0;
        list-style:none;
    }

    #nav li {
        display:inline;
        margin:0;
        padding:0;
    }

    #nav {
        padding:2px 10px;
        background:#444;

    }

    #nav li{
        margin-right: 5px;
        margin-left:5px;
    }

    #nav a:link, a:visited, a:active{
        text-decoration: none;
        color: white;
        padding-left: 5px;
        padding-right: 5px;
    }

    #nav a:hover{
        text-decoration: underline;
    }
    
    #about {
        /*float: right;*/
        font-size: 0.8em;
        font-style: italic;
    }

    #author{
        float: right;
        display: inline;
    }

    #version{
        float: left;
        display: inline;
        margin-left:0;
    }
    #content {
        text-align: center;
        margin-left: auto;
        margin-right: auto;
        text-align:left;
    }
    
    #content h1{
        margin: 1em;
        text-align: center;
    }

    #content p{
        line-height: 1em;
        margin-top: 0em;
        margin-bottom: 0.3em;
    }
    
    #helix{
       /* width: 600;
        height: 150;*/
        text-align: center;
    }
    
    #data {
        margin-left: auto;
        margin-right: auto;
        text-align: center;
    }
    
    #tip {
        margin-left: auto;
        margin-right: auto;
        font-size: 0.7em;
        font-style: italic;
        text-align: right;
        width: 800px;
    }
    
    #data table {
        margin-left: auto;
        margin-right: auto;
   
    }
/*

    #main {
        position: absolute;
        width:800px;
        background: white;
        margin-right: auto;
        margin-left: 200px;
        padding: 20px;
    }

    #main ul{
        list-style-position: inside;
    }

    #main p{
        margin-top: 0;
        margin-bottom: 0;
        padding-top: 0;
        padding-bottom: 0;
    }

    #main.section {
        margin-left: 200px;
    }

    .imgEx {
        border: 1px solid black;
        padding: 3px;
    }

    #sidebar {
        position: absolute;
        width: 200px;
        left: 0px;
        padding: 10px;
        background: #000;
        color: white;
        margin-right: 15px;
    }

    #sidebar a:link, a:visited, a:active{
        color: white;
        text-decoration: none;

    }

    #sidebar a:hover{
        text-decoration: underline;
    }    

*/
    .math{
        text-align: left;
        font-family: Time New Roman;
        font-style: italic;
        font-size: 1.1em;
        border: 1px solid #DDDDDD;
        display: table;
        margin: 10px 0 10px 50px;
        padding: 5px 5px 5px 5px;
    }
    #footer {
        padding:5px 10px;
        background-color: #AAAAAA;
        border-top: solid 1px black;
        width: 100%;
        margin-top: 20px;
    }

input[type=range]::-ms-track {
    width: 100px;
    height: 5px;

    /*remove bg colour from the track, we'll use ms-fill-lower and ms-fill-upper instead */
    /*background: transparent;*/

    /*leave room for the larger thumb to overflow with a transparent border */
    border-color: transparent;
    border-width: 6px 0;

    /*remove default tick marks*/
    color: transparent;
}
input[type=range]::-ms-fill-lower {
    background: #777;
    border-radius: 10px;
}
input[type=range]::-ms-fill-upper {
    background: #ddd;
    border-radius: 10px;
}
input[type=range]::-ms-thumb {
    border: none;
    height: 16px;
    width: 16px;
    border-radius: 50%;
    background: goldenrod;
}
input[type=range]:focus::-ms-fill-lower {
    background: #888;
}
input[type=range]:focus::-ms-fill-upper {
    background: #ccc;
}