/* CSS for kokkolanratsastajat */

* { margin: 0; padding: 0; }

body {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 13px;
    color: #333;
    background: #71d3f1;
}

a { color: #049cce; }

#container {
    width: 760px;
    margin: 15px auto;
    background: url(images/container.gif) repeat-y;
}

/* Header incl. slideshow */ 
#header {
    margin-bottom: 15px; 
    position: relative;
    background: url(images/header.gif) no-repeat;
}
a.logo { 
    display: block;
    width: 76px;
    height: 93px;
    position: absolute;
    top: 15px;
    left: 20px;
    z-index: 100;
    background: url(images/logolink.gif) no-repeat top;
}
a.logo:hover { background: url(images/logolink.gif) no-repeat bottom; }
a.logo img { display: none; }
.slideshow { position: relative; top: 5px; left: 10px; height: 185px; }
#header h1 { width: 700px; margin-left: 10px; font-size: 18px; padding: 8px 0; background: url(images/header-bottom.gif) bottom; }
#header h1 a { margin-left: 10px; color: #f6f6f6; font-weight: normal; text-decoration: none; }

/* Inner-container */
#inner-container {
    width: 700px;
    margin-left: 10px;
}

/* Sidebar incl. navigation */
.sidebar {
    float: left;
    width: 160px;
    padding-bottom: 15px;
}
ul.nav { list-style: none; font-weight: bold; }
li { margin-bottom: 2px; padding: 0; }
li a { display: block; width: 140px; padding: 10px; color: #333; background: #eef6fa; text-decoration: none; }
li a:hover { background: #c8e9fa; }
li.selected a { background: url(images/menu.gif) bottom; color: #fff; cursor: default; }
li.selected a:hover { background: url(images/menu.gif) bottom; color: #fff; cursor: default; }

/* Content */
#content {
    float: right;
    width: 520px;
    margin-right: 1px;
    padding-bottom: 15px;
    line-height: 1.5em;
}
#content p { margin-bottom: 20px; }
#content h2 { clear: both; font-family: "Trebuchet MS", Lucida Grande, Arial, Helvetica, sans-serif; font-size: 20px; font-weight: normal; margin-bottom: 5px; color: #a4c735; }
#content ul, #content ol { list-style-position: inside; margin-bottom: 15px; }
#content ol { font-weight: bold; clear: both; margin-bottom: 25px; }
#content ol li span { font-style: italic; font-weight: normal; }

/* Footer */
#footer {
    clear: both;
    width: 720px;
    margin: 0;
    padding-bottom: 15px;
    background: url(images/footer.gif) no-repeat bottom;
}
#footer p { margin: 0 20px; padding-top: 10px; }


/* Classes */
.notice {
    clear: both;
    padding: 10px;
    background: #fdf9c4; 
}

.date {
    display: block;
    margin: -5px 0 2px 0;
    font-size: 11px;
    font-weight: bold;
    text-transform: uppercase;
    color: #000;
}

.edustuspic {
    display: block;
    width: 50px;
    height: 50px;
    float: left;
    margin-right: 10px;
    overflow: hidden;
    text-align: center;
    padding-bottom: 10px;
}

.edustuspic img {
    width: 50px;
    height: 50px;
    border: 0;
}

.spotlight { padding: 10px; }
.spotlight span { font-style: italic; }
.clear { clear: both; }

hr { clear: both; margin-bottom: 25px; height: 1px; background: #a4c735; border: 0; }

.left { float: left; }
.right { float: right; }
.center { text-align: center; }

.light { color: #999; }
.small { font-size: 11px; }

div.pic { float: left; display: block; width: 100px; height: 70px; overflow: hidden; border: 2px solid #fff; margin-bottom: 10px; }

/* Link in footer, goes the balamba.com */
p.hirebalamba {
    font-size: 11px;
    text-align: right;
    color: #999;
}
p.hirebalamba a { font-size: 12px; font-weight: bold; color: #000; text-decoration: none; }