a {
      text-decoration:none;
   }
   
   nav {
        background-color:           #000000; /* black */
        border:                     thin solid #888888; /* light gray */
        font-size:                  11pt;
        font-family:                DejaVuSansMono Web;
        color:                      #ededed; /* white gray */
        text-align:                 center;
        display:                    block;
        padding-top:                0.5rem;
        padding-bottom:             0.5rem;
        max-width:                  70%;
        margin:                     1rem auto 1.6rem auto;
   }
   
   nav a {
        display:                    inline;
        text-decoration:            none;
        font-weight:		        bold;
        font-size:                  11pt;
        letter-spacing:		        0.1em;
        padding-left:               1.8rem;
        padding-right:              1.8rem;
    }
    
    nav a:hover {
        background-color: #000;
    }
    
   a:link {
        color:                      #0000cc; /* blue */
        text-decoration:            none;
        outline:                    0;
    }

    a:visited {
        color:                      #dd0000; /* red */
        outline:                    0;
    }

    a:focus {
        outline:                    0;
    }

    a:hover {
        color:                      #cc9900; /* nice yellow */
    }

    a:active {
        color:                      #009900; /* nice green */
        outline:                    0;
    }

    .infop {
        text-align:                 left; /* justify; */
        display:                    block;
        width:                      75%;
        margin:                     auto;
    }

    .infoul {
        text-align:                 left; /* justify; */
        display:                    block;
        width:                      75%;
        margin:                     auto;
    }

    .infoh {
        text-align:                 left;
        display:                    block;
        width:                      75%;
        margin:                     auto;
    }

    /* The title of the page section being viewed */
    #section_heading {
        letter-spacing:		        0.3rem;
        font-size:                  18pt;
        color:			            #009900; /* nice green */
        background-color:           #f9f9f9;; /* gray */
        /*border:                     thin solid #888888; /* light gray */
        font-family:                DejaVuSansMono Web;
        font-weight:                bold;
        padding-top:                0.5rem;
        padding-bottom:             0.5rem;
        text-align:                 center;
    }
    
    #section_content {
        background-color:           #f9f9f9;; /* gray */
        /*border:                     thin solid #888888; /* light gray */
        margin-top:                 -1px; /* Fixes the double bottom border with the #section_heading. */
        padding-left:               0.5rem;
        padding-right:              0.5rem;
    }

    code,
    pre {
        font-family:                DejaVuSansMono Web;
    }
    
    code {
        padding-top:                0.18em;
        padding-bottom:             0.18em;
        padding-right:              0.2em;
        padding-left:               0.2em;
        font-size:                  92%;
        color:                      #009900;
        background-color:           #cccccc;
        border-radius:              3px;
        width:                      inherit;
    }
    
    pre {
        display:                    block;
        margin-top:                 0;
        margin-bottom:              1rem;
        padding:                    1rem;
        font-size:                  .8rem;
        line-height:                1.4;
        white-space:                pre;
        white-space:                pre-wrap;
        word-break:                 break-all;
        word-wrap:                  break-word;
        background-color:           #f9f9f9;
    }
    
    pre code {
        padding:                    0;
        font-size:                  100%;
        color:                      inherit;
        background-color:           transparent;
    }

    @media screen and (max-width: 500px) {
        nav {
            max-width: 100%;
            background-color: #999;
            overflow: auto;
            font-family:                DejaVuSansMono Web;
            padding-top:                0;
            padding-bottom:             0;
        }
   
        nav a {
            float: none;
            display: block;
            width: 100%;
            text-align: left;
            padding-left:               0;
            padding-right:              0;
        }
    }

    /*320 x 533*/
    @media only screen and (min-width: 501px) and (max-width: 970px) {
        nav {
            max-width: 100%;
            background-color: #999;
            overflow: auto;
            font-family:                DejaVuSansMono Web;
            padding-top:                0;
            padding-bottom:             0;
        }
   
       /* nav a {
            display:                    inline;
            text-decoration:            none;
            font-weight:		        bold;
            font-size:                  11pt;
            letter-spacing:		        0.1em;
            padding-left:               3rem;
            padding-right:              3rem;
        } */
        
        nav a {
            float:                      left;
            padding-left:               0;
            padding-right:              0;
            color:                      white;
            text-decoration:            none;
            font-size:                  11pt;
            font-weight:		        bold;
            width:                      25%; /* Four links of equal widths */
            text-align:                 center;
            padding-top:                0.5rem;
            padding-bottom:             0.5rem;
        }
    }
    
    @media only screen and (min-width: 971px) and (max-width: 1200px) {
        nav {
            max-width: 100%;
            background-color: #999;
            overflow: auto;
            font-family:                DejaVuSansMono Web;
            padding-top:                0;
            padding-bottom:             0;
        }
   
       /* nav a {
            display:                    inline;
            text-decoration:            none;
            font-weight:		        bold;
            font-size:                  11pt;
            letter-spacing:		        0.1em;
            padding-left:               3rem;
            padding-right:              3rem;
        } */
        
        nav a {
            float:                      left;
            padding-left:               0;
            padding-right:              0;
            color:                      white;
            text-decoration:            none;
            font-size:                  11pt;
            font-weight:		        bold;
            width:                      25%; /* Four links of equal widths */
            text-align:                 center;
            padding-top:                0.5rem;
            padding-bottom:             0.5rem;
        }
    }
    
    @media only screen and (max-width: 1200px) {
        .infop {
            text-align:                 left; /* justify; */
            display:                    block;
            width:                      90%;
            margin:                     auto;
        }

        .infoul {
            text-align:                 left; /* justify; */
            display:                    block;
            width:                      90%;
            margin:                     auto;
        }

        .infoh {
            text-align:                 left;
            display:                    block;
            width:                      90%;
            margin:                     auto;
        }
    }
    
    @media only screen and (min-width:1201px) and (max-width: 1500px) {
        .infop {
            text-align:                 left; /* justify; */
            display:                    block;
            width:                      85%;
            margin:                     auto;
        }

        .infoul {
            text-align:                 left; /* justify; */
            display:                    block;
            width:                      85%;
            margin:                     auto;
        }

        .infoh {
            text-align:                 left;
            display:                    block;
            width:                      85%;
            margin:                     auto;
        }
    }
    
    
    @media only screen and (min-width: 1201px) and (max-width: 1920px) {
        nav {
            background-color:           #999;
            overflow:                   auto;
            font-family:                DejaVuSansMono Web;
            padding-top:                0;
            padding-bottom:             0;
        }
   
       /* nav a {
            display:                    inline;
            text-decoration:            none;
            font-weight:		        bold;
            font-size:                  11pt;
            letter-spacing:		        0.1em;
            padding-left:               3rem;
            padding-right:              3rem;
        } */
        
        nav a {
            float:                      left;
            padding-left:               0;
            padding-right:              0;
            color:                      white;
            text-decoration:            none;
            font-size:                  11pt;
            font-weight:		        bold;
            width:                      25%; /* Four links of equal widths */
            text-align:                 center;
            padding-top:                0.5rem;
            padding-bottom:             0.5rem;
        }
    }
    
    @media only screen and (min-width: 1201px) and (max-width: 1500px) {
        nav {
            max-width:                  86%;
        }
    }
    
    @media only screen and (min-width: 1501px) and (max-width: 1920px) {
        nav {
            max-width:                  80%;
            text-align:                 center;
        }
        nav a {
            text-align:                 center;
            width:                      25%; /* Four links of equal widths */
        }
    }