﻿html{background-color:  Black; color:  White;}
body {
    font-family: Garamond;
    font-size: 12pt;
    color: White;
    border-color: Navy;
}

.root{
    position:  relative;
    width: 85%;
    margin: 0 auto;
    position: relative;
    color:  Yellow;
}

.block{
    position:  relative;
    box-sizing: border-box;
    width: 25%;
    padding: 1em;
}

a{color: White;}
#menu 
{
    position: fixed;
    top: 0;
    left: 0;
    width: 10em;
    padding: 3px;
    z-index: 100;
}

    #menu ul {
        position: relative;
        width: 70%;
        margin: 0 auto;
        padding: 0;
        list-style-type: none;
    }

    #menu li {
        width: 99%;
        margin: 0 auto;
        padding: 0;
        min-height: 1.75em;
        vertical-align: middle;
        position: relative;
        color:  Yellow;
        box-sizing: border-box;
    }
    
    li:hover{
        padding: 3px;
        /*background-color: orange;*/
        /*color: black;*/
    }

    #menu .btn {
        font-family: Arial;
        font-weight: normal;
        font-size: 9pt;
        color: inherit;
        text-decoration: none;
        position: relative;
        padding: 2px;
        border: solid 1px white;
        background-color: black;
        width: 99%;
        margin: 0 0;
        text-align: center;
        display: inline-block;
    }

        #menu .btn:hover {
            background-color: black;
            color: white;
            border: solid 1px black;
            font-weight: bold;
        }

a 
{
    color:  cyan;
    text-decoration: none;
}

a:hover{
    color: Orange;
    font-weight: bold;
    text-transform: uppercase;
    font-size: .7em;
}
a:hover::after{
    content: '--*';
}
a:hover::before{
    content: '*--';
}

h1
{
    font-size:  72px;
    text-align: center;
}

ul
{
    list-style-type:  none;
    margin:  0;
    padding:  0;
}

h1, h2{
    color: red;
    margin: 0;
}