body {
    margin:     0;
    padding:    0;
    font: normal 12px Verdana, Arial, Helvetica, sans-serif;
    color:      #444;
    background-color: #fff;
}


a {
    text-decoration:    none;
    color:              #444;
}


a:hover {
    color:              #000;
}

.pixel {
    position:           absolute;
    top:                0;
    left:               0;
    width:              1px;
    height:             1px;
    overflow:           hidden;
}

.component {
    position:   relative;
    margin:     0px auto;
    padding:    5px 5px 15px 5px;
    background-color:   #fff;
}

.component ul {
    padding:            0;
    margin:             0;
    list-style-type:    none;
}


.component h1 {
    font-size:  16px;
}

.component ul li {
    display:        block;
    width:          100%;
    padding:        1px;
    border-bottom:  1px dotted #444;
}

.component ul li.highlight {
    font-weight:    bold;
}


.component#broadcast {
    padding-right:    90px;
}

.component#broadcast ul.hosts {
    text-transform:     uppercase;
}


.component#broadcast ul.hosts img.host {
    position:           absolute;
    top:                5px;
    right:              5px;
    width:              80px;
    height:             80px;
}


.component#broadcast li {
    border-bottom:      0 none;
}


.component#playlist .artist {
    text-transform: uppercase;
}


.component#podcasts object {
    width:              100%;
    background-color:   #fff;
}


.component#channels li {
    font-weight:        bold;
}


/***********************************************************************************************************************
  Stylesheets für die Boxen mit runden Ecken und Schatten, basierend auf dem Relaunch-Klickdummy 
***********************************************************************************************************************/  
.corner, .shadow, .separator {
    display:            block;
    overflow:           hidden;
    font-size:          0%;
    background-repeat:  no-repeat;
}

.corners, .outline {
    position:           relative;
}

.corners {
    width:      100%;
    overflow:   hidden;
}

.outline {
    border-width:       1px;
    border-style:       solid;
    background-color:   #f3f3f3;
    border-color:        #d8dde1;
}

.outline, .header .content {
    background-image:       url('__pix/outline-gradient.png');
    background-repeat:      no-repeat;
    background-position:    bottom right;
}


.header {
    margin:             0px 0px 5px 0px;
}

.content {
    padding:            5px;
}

.header .content {
    display:            block;
}

.corners .corner {
    display:    block;
    position:   absolute;
    width:      5px;
    height:     5px;
    background-image: url('__pix/corners.png');
    z-index:    99;
}

.corner.TL { 
    top: 0;
    left: 0;
}

.corner.TR {
    top: 0;
    right: 0;
}

.corner.BL {
    bottom: 0;
    left: 0;
}

.corner.BR {
    bottom: 0;
    right: 0;
}

.corner.TL {
    background-position: 0px 0px;
}

.corner.TR {
    background-position: -5px 0px;
}

.corner.BL {
    background-position: 0 -5px;
}

.corner.BR {
    background-position: -10px -5px;
}

.header .separator {
    display:    block;
    width:      100%;
    height:     1px;
    margin:     0px auto;
    background: transparent url('__pix/separator-horizontal.png') repeat-x top center;
}

.shadow.right {
    position:                   absolute;
    right:                      0;
    top:                        0;
    width:                      1px;
    height:                     100%;
    background:                 transparent url('__pix/corners-shadow-right-gradient.png') no-repeat center left;
    background-size:            100% 100%;
    
    /* browser-spezifische Erweiterungen für Browser, die die CSS3-Eigenschaft "background-size" nicht unterstützen */
    -moz-background-size:       100% 100%;
    -webkit-background-size:    100% 100%;
    -o-background-size:         100% 100%;
    -khtml-background-size:     100% 100%;
}

.shadow.bottom {
    width:      100%;
    height:     8px;
    background: transparent url('__pix/corners-shadow-bottom.png') no-repeat top center;
    background-size:            100% 100%;
    
    /* browser-spezifische Erweiterungen für Browser, die die CSS3-Eigenschaft "background-size" nicht unterstützen */
    -moz-background-size:       100% 100%;
    -webkit-background-size:    100% 100%;
    -o-background-size:         100% 100%;
    -khtml-background-size:     100% 100%;
}