a, a:visited, a:active
{
    color: white;
    text-decoration: none;
}

a:hover
{
    color: white;
    text-decoration: underline;
}

body
{
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 10px;
    color: white;
    border: 0;
    margin: 0;
    padding: 0;
}

#bg
{
    background: url(img/outer.png);
    background-color: #000000;
    background-repeat: repeat-y;
    background-position: center;
}


#container
{
    width: 995px;
    margin: 0 auto;
    background: url(img/inner.jpg);
    background-repeat: repeat;
    display: grid;


    /*
    ###########################
    #          HEADER         #
    ###########################
    #         SPONSOR         #
    ###########################
    #     #            #      #
    #     #            #      #
    # NAV #    MAIN    # SIDE #
    #     #            #      #
    #     #            #      #
    ###########################
    #         FOOTER          #
    ###########################
    */

    grid-template-areas:
        "header  header  header"
        "sponsor sponsor sponsor"
        "nav     main    side"
        "footer  footer  footer"
    ;

    min-height: 100vh; /* at least full viewport height */

    grid-template-rows: auto auto 1fr auto; /* third row consumes all additional space */

    grid-gap: 0;
}


header
{
    grid-area: header;
    height: 226px;
    background:url(img/header.png);
    position: relative;
}

#url
{
    position: absolute;
    top: 3px;
    left: 25px;
}

#newsticker
{
    position: absolute;
    top: 3px;
    /* left: 275px; */
    right: 25px;
}

#sponsortext
{
    position: absolute;
    bottom: 6px;
    width: 100%;
    text-align: center;
    font-size: 11px;
    padding-left: 11px;
}

div.sponsor
{
    grid-area: sponsor;
    background: url(img/sponsor.png);
    width: 100%;
    height: 150px;
}

img.sponsor
{
    display: block;
    margin: 0 auto;
}

nav
{
    grid-area: nav;
    width: 190px;
    background: url(img/left.png);
    margin-right: 41px;
}

nav > ul
{
    margin: 0;
    margin-top: -82px;
    margin-left: 2px;
    padding: 0;
}

nav > ul > li
{
    display: block;
    margin: 0;
    background: url(img/category.png);
    background-repeat: no-repeat;
    width: 164px;
    min-height: 53px;
}

nav > ul > li > h3
{
    display: block;
    padding-left: 60px;
    padding-top: 17px;
    font-weight: normal;
}

nav > ul > li > h3::before
{
    content: "\00BB";
    margin-right: 8px;
    color: #003cff;
}

nav > ul > li > ul
{
    margin: 0;
    padding: 0;
    margin-top: -2px;
    margin-left: 50px;
}

nav > ul > li > ul > li
{
    display: block;
}

nav > ul > li > ul > li > a
{
    display: block;
    width: 112px;
    height: 22px;
    background: url(img/button.png);
    box-sizing: border-box; /* including padding & border in dimensions */
    padding-top: 5px;
    padding-left: 9px;
}

nav > ul > li > ul > li > a::before
{
    content: "\00BB";
    margin-right: 17px;
    color: #003cff;
}

nav > ul > li > ul > li > a:hover
{
    background: url(img/button_hover.png);
    text-decoration: none;
}

nav > ul > li > ul:last-child
{
    margin-bottom: -23px;
}


ul#partner
{
    margin-left: 45px;
}

ul#partner li
{


}

ul#partner li a
{
    background: initial;
    width: initial;
    height: initial;
    padding: 0;
    
}

ul#partner li a::before
{
    content: "";   
}



main
{
    grid-area: main;
    width: 532px;
    background: url(img/middle.png);
    margin-right: 43px;
    box-sizing: border-box;
    padding-left: 20px;
    padding-right: 20px;
    margin-top: -30px;
}

main h2
{
    display: block;
    text-align: center;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 14px;
    color: #ffffff;
    text-transform: uppercase;
    font-weight: bold;
}


aside
{
    grid-area: side;
    width: 189px;
    background: url(img/right.png);
}


aside > ul
{
    margin: 0;
    margin-top: -69px;
    margin-left: 18px;
    padding: 0;
}


aside > ul > li
{
    display: block;
    margin: 0;
    background: url(img/category.png);
    background-repeat: no-repeat;
    width: 164px;
    min-height: 53px;
}

aside > ul > li > h3
{
    display: block;
    padding-left: 60px;
    padding-top: 17px;
    font-weight: normal;
}

aside > ul > li > h3::before
{
    content: "\00BB";
    margin-right: 8px;
    color: #003cff;
}

aside div.infobox
{
    width: 175px;
    overflow: hidden;
    margin: 27px auto 0 auto;
    font-size: 9px;
}

aside div.infobox ul
{
    margin: 0;
    padding-left: 20px;
    list-style-type: disc;
}

aside div.infofooter
{
    background: url(img/infofooter.png);
    width: 174px;
    height: 26px;
    margin-top: 3px;
    margin-left: -8px;
    margin-bottom: -8px;
}

aside div.infofooter a
{
    position: relative;
    top: 2px;
    display: block;
    width: 112px;
    height: 22px;
    background: url(img/button.png);
    box-sizing: border-box; /* including padding & border in dimensions */
    padding-top: 4px;
    padding-left: 9px;
    margin: 0 auto;
}

aside div.infofooter a::before
{
    content: "\00BB";
    margin-right: 17px;
    color: #003cff;
}

aside div.infofooter a:hover
{
    background: url(img/button_hover.png);
    text-decoration: none;
}



footer
{
    grid-area: footer;
    background: url(img/footer.png);
    height: 174px;
    position: relative;
}

#copyright
{
    position: absolute;
    top: 37px;
    width: 100%;
    text-align: center;
}

#advertisement
{
    position: absolute;
    top: 60px;
    width: 100%;
    text-align: center;
    font-size: 11px;
}

footer > img
{
    display: block;
    margin: 90px auto 0 auto;
}



