body
{
background-color: black;
font-size: 20px;
color: black;
font-family: Verdana;
}

#container
{
    width: 1000px;
    margin-right: auto;
    margin-left: auto;
}

#menu
{
    background-color: #303030;
    margin-top: 20px;
    padding: 20px;
}

#logo
{
    color: white;
    margin-top: 20px;
    letter-spacing: 3px;
}

#topbar
{
    background-color: #f7d19e;
    color: white;
    margin-top: 20px;
    margin-bottom: 25px;
    padding: 10px;
    height: 180px;
}

#topbarL
{
    float: left;
    padding: 20px;
    width: 138px;
    border-right: 2px dotted #cccccc;
    text-align: center;
}

#topbarR
{  
    float: left;
    padding: 20px;
    width: 760px;
    text-align: justify;
}

#sidebar
{
    float: left;
    width: 148px;
    min-height: 620px;
    padding: 20px;
    background-color: lightgrey;
    text-align: center;
    border-right: 2px dotted #666666;
}

#content
{
    float: left;
    padding: 40px;
    width: 730px;
    background-color: #dedede;
    min-height: 580px;
    text-align: justify;
    font-size: 14px;
}

#footer
{
    clear: both;
    color: white;
    padding: 20px;
    font-size: 18px;
}


.option
{
    float: left;
    min-width: 50px;
    height: 25px;
    font-size: 20px;
    padding: 10px;
    border-right: 2px dotted #444444;
    opacity: 0.8;
}

.option:hover
{
    background-color: #222222;
    cursor: pointer;
}

.optionL
{
    height: 25px;
    padding: 10px;
    border-bottom: 2px dotted #444444;
}

.optionL:hover
{
    background-color: #f36742;
    color: white;
    cursor: pointer;
}

.bigtitle
{
    font-size: 32px;
    font-weight: 900;
    letter-spacing: 2px;
}

.dotted
{
    height: 5px;
    margin-top: 15px;
    margin-bottom: 20px;
    border-bottom: 2px dotted #444444;
}