body {
 font-family: Tahoma, Verdana, sans-serif;
}

#content {
    color: #FFFFFF;
}

#content a  {
    color: #FFFFFF;
    font-weight: bold;
    text-decoration: none; 
}

.page_header {
    background-color: transparent;
    margin-left: 75px;
    color: #fff;
}

/* Logo */
#logo {
    position: relative;
    top: 3px;
    zoom: 1;
    text-align: center;
}

/* Menu */
#top_menu {
	margin-top:15px;
	margin-left margin-right: auto;
}


#navi ul {
    margin: 0;
    padding: 0;
    list-style-type: none;
    text-align: center;
    font-size:11px;
    font-family: Tahoma, Verdana, sans-serif;
    font-weight:bold;

}

#navi ul li {
    display: inline;
}

#navi ul li a { 
 padding: .2em 1em;
 color: #fff;
 background-color: #000; 
 text-decoration: none;
 border: solid 1px #000;  
}


#navi ul li a.selected_menu_item, #navi ul li a:hover
{
 color: #fff;
 background-color: #2b2838 ;
}
/* End of menu */

.big_letter {
  font-size: 24px;
}


html, body {
        font-size: 14px; /* this blocks font size chaning in IE7 but document scaling works pretty well */
        height: 100%;
        min-height: 100%;
        min-width: 100%;
        margin: 0;
        padding: 0;
        position: relative;
        width: 100%;
}
* html {
        font-size: 97%;  
}
* html body {
        font-size: 90%;  /* this meet 14px by default in all IEs with default settings */
}

#container {
        min-height: 100%;
        height: 100%;
        min-width: 55em;
        width: 100%;
}
/*
*  for IE<7 fix min-width behavior
*/
* html #container {
        behavior: url('minwidth.htc');
        width: 55em;
}

#container #content {
        height: 100%;
        min-height: 100%;
        position: relative;
        width: 100%;
}
#container #header {
        min-height: 1.2em;
        height: 1.2em;

}
#container #pagebody {
        padding-top: 1px;        /* this should be defined, otherwise we'll have a gap on top */
        border: 1px solid red;
}

#footer {
        position: relative;
}
#footer #foot {
        min-height: 3.86em;
        height: 3.86em;
        padding-top: 0.86em;
}
html>body #container #header,
html>body #container #content,
html>body #footer #foot {
        height: auto;            /* used to fit font-sizing feature of Mozilla/FireFox */
}
/*
*  Container overlapping
*/
#container #pagebody {
        padding-bottom: 3.9em;    /* this value need to ba same as full height of the footer or greater
                                     footer top padding should be maintained in it's definition (see below)
                                     NOTE: don't set VERTICAL padding/margins on #container, #header, #pagebody!
                                  */
}
#footer {
        margin-top: -2.9em;       /* how high we will go */
}
/*************************************
*  Additional overrides
*
*  They are used to make pages look close in the differrent browsers
**************************************/
a img {
        border: none;
}

h1 {
        font-size: 2.3em;
        margin: 1.43em 0 1.43em 2.14em;
        padding: 0;
}
h2 {
        font-size: 2.2em;
        margin: 1.29em 0 1.29em 1.86em;
        padding: 0;
}
h3 {
        font-size: 2.1em;
        margin: 16px 0 16px 22px;
        padding: 0;
}
h4 {
        font-size: 2em;
        margin: 1.14em 0 1.14 1.29;
        padding: 0;
}
ol {
        margin: 0.14em 0 0.14em 2.79em;
        padding: 0;
}
* html ol, * html ul {
        padding: 0 0 .07em;
}
* html li { 
        padding: .07em 0 0;
}
/*
ul {
        margin: .14em 0;
        padding: 0;
}
ul li {
*  Assign this override to force browsers to have the same list markers.
*  If you need to implement nested markers, define more nested rules
*  Note, this way you cound not change marker color, beside adding personal images
*
*

        background: url(li.gif) 1.6em 50% no-repeat;
        list-style: none;
        padding-left: 2.79em;
        position: relative;
}
*/
/*************************************
*  Special elements and hacks
**************************************/
.clearfix:after {
        content: "."; 
        display: block; 
        height: 0; 
        clear: both; 
        visibility: hidden;
}
.clearfix {display: inline-block;}

/* Hides from IE-mac \*/
* html .clearfix {height: 1px;}
.clearfix {display: block;}
/* End hide from IE-mac */

/*************************************
*  Design page template styles
**************************************/
#container #pagebody {
        margin:40px 90px 40px 90px;
        padding:20px;
        background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAABGdBTUEAAK/INwWK6QAAABl0RVh0U29mdHdhcmUAQWRvYmUgSW1hZ2VSZWFkeXHJZTwAAAAPSURBVHjaYvDyCGkACDAAAy0BZ0aWA+0AAAAASUVORK5CYII=);
        background:rgba(57, 53, 66, 0.6);
        border: solid 1px #000;
}

#container #footer {
{
        margin-left: 1em;
        margin-right: 1em;
}

#container #header {
        padding-left: 1em;
        padding-right: 1em;
}
/*
*  Font families and colors
*/
body {
        background-color: #f4f4f4;
        color: #fff;
}
div, p, span {
        font-size: 1em;
}

#footer #foot, #header {
        color: #fff;
        background: transparent;
        text-align: center;
}