@charset 'utf-8';

/**
 * @version 200901071327
 * @author  Rolf den Hartog - rolf@rolfdenhartog.nl
 */

/**
 * reset
 */
a, body, form, fieldset, h1, h2, h3, html,
img, input, li, p, table, td, textarea, th, tr, ul {
    border: 0px;
    font-family: arial, nimbus sans l, helvetica, sans-serif;
    font-size: 100%;
    margin: 0px;
    outline: none;
    padding: 0px;
}

/**
 * main tags
 */
a:link, a:visited {
    color: #146698;
    font-weight: bold;
    text-decoration: underline;
}
a:hover, a:active {
    color: #fa5a3f;
    text-decoration: none;
}
body {
    background: #214f6a url('/assets/gfx/body-background.png') repeat-x top;
    color: #214f6a;
    font-size: 0.7em;
}

h1 {
    font-size: 130%;
    margin-bottom: 10px;
}
h2 {
    font-size: 115%;
    margin-bottom: 10px;
}
h3 {
    font-size: 100%;
    margin-bottom: 10px;
}

li {
    margin-left: 20px;
}
ol, ul {
    margin-bottom: 10px;
}

p {
    margin-bottom: 10px;
}

table {
    width: 100%;
    margin-bottom: 10px;
}
td, th {
    padding: 2px;
}

/**
 * header
 */
#header {
    height: 150px;
    margin: 0px auto;
    width: 990px;
}

/**
 * navigation
 */
#navigation {
    background: #fff;
    margin: 0px auto;
    padding: 20px 20px 20px 10px;
    width: 960px;
}
#navigation div {
    border-top: 1px solid #000;
    border-bottom: 1px solid #000;
    float: left;
    margin-left: 10px;
    padding: 5px;
    width: 220px;
}
#navigation div a:link,
#navigation div a:visited {
    color: #f75a3f;
    text-decoration: none;
}
.navigation-hover {
    background: #f9e570;
    cursor: pointer;
}
.navigation-active {
    background: #f9e570;
    cursor: default;
}

/**
 * content
 */
#content {
    background: #fff;
    margin: 0px auto;
    padding: 0px 20px 20px 10px;
    width: 960px;
}

/**
 * columns
 */
.column-small {
    float: left;
    margin-left: 10px;
    width: 230px;
}
.column-medium {
    float: left;
    margin-left: 10px;
    width: 470px;
}
.column-large {
    float: left;
    margin-left: 10px;
    width: 710px;
}
#page-two-columns #page-column-one-text {
    float: left;
    width: 470px;
}
#page-two-columns #page-column-two-text {
    float: left;
    margin-left: 10px;
    width: 230px;
}

/**
 * box blue
 */
.blue {
    border: 1px solid #dde6ec;
    margin-bottom: 10px;
    padding: 5px;
}
.blue h1 {
    background: #9eb1bd url('/assets/gfx/blue-h1-background.png') repeat-x top;
    color: #214f6a;
    margin: -5px -5px 5px -5px;
    padding: 3px;
}

/**
 * box red
 */
.red {
    border: 1px solid #fac8bf;
    margin-bottom: 10px;
    padding: 5px;
}
.red h1 {
    background: #fac8bf url('/assets/gfx/red-h1-background.png') repeat-x bottom;
    color: #fff;
    margin: -5px -5px 5px -5px;
    padding: 3px;
}

/**
 * box yellow (gradient)
 */
.yellow-gradient {
    background: #fcf6d5 url('/assets/gfx/yellow-background-gradient.png') repeat-x bottom;
    margin-bottom: 10px;
    padding: 5px;
}
.yellow-gradient h1 {
    background: #fcf6d5 url('/assets/gfx/yellow-h1-background.png') repeat-x bottom;
    color: #f75a3f;
    margin: -5px -5px 5px -5px;
    padding: 3px;
}

/**
 * box blue (gradient)
 */
.blue-gradient {
    background: #e9eff3 url('/assets/gfx/blue-background-gradient.png') repeat-x bottom;
    margin-bottom: 10px;
    padding: 5px;
}
.blue-gradient h1 {
    background: #e9eff3 url('/assets/gfx/blue-h1-background.png') repeat-x bottom;    
    color: #214f6a;
    margin: -5px -5px 5px -5px;
    padding: 3px;
}

/**
 * radio schedule table
 */
.program h2 {
    margin: 5px 0px 0px 0px;
}
.program td {
    border-bottom: 1px dashed #000;
}
.program tr.passed td,
.program tr.passed td a {
    color: #ccc;
}
.program tr.current td {
    color: red;
}

/**
 * program view
 */
#radio-schedule-playlist .ui-accordion-header {
    padding-left: 24px;
}
#radio-schedule-playlist .ui-state-default {
    background: transparent url('/assets/gfx/arrow-right-blue.png') no-repeat left center;
    cursor: pointer;
}
#radio-schedule-playlist .ui-state-active {
    background: transparent url('/assets/gfx/arrow-down-blue.png') no-repeat left center;
}

/**
 * table calendar
 */
.calendar h2 {
    margin: 10px 0px 0px 0px;
}
.calendar th {
    border-bottom: 1px dashed #214f6a;
}
.calendar td {
    height: 20px;
    text-align: center;
    width: 14%;
}
.calendar a {
    display: block;
}
.calendar .calendar-hover,
.calendar .calendar-active {
}
.calendar .calendar-active a {
}

/**
 * footer
 */
#footer {
    background: #146496 url('/assets/gfx/footer-background.png') repeat-x top;
    padding: 20px 0px 100px 0px;
}
#footer-wrapper {
    color: #fff;
    margin: 0px auto;
    padding: 0px 20px 0px 10px;
    width: 960px;
}
#footer a:link,
#footer a:visited {
    color: #fff;
}

/**
 * other styles
 */
.clear-both {
    clear: both;
}
.color-gray {
    color: #ccc;
}
.display-none {
    display: none;
}
.float-left {
    float: left;
}
img.float-left {
    margin: 0px 10px 5px 0px;
}
.float-right {
    float: right;
}
img.float-right {
    margin: 0px 0px 5px 10px;
}
.text-align-center {
    text-align: center;
}