/*=========================================================================
|
|   file:    phm-screen.css
|   site:    hochklappdings.de
|   descr:   Haupt-Stile (Layout etc.)
|   version: 1.0 - 2008/08/21 19:15
|
|   ------------------------------------------------------------------------
|
|   author:   Christoph Sch��ler
|   aut. url: http://herr-schuessler.de
|
| ==============================================================================
|   
|   Content:
|   
|   0   browser reset
|   1.1 layout: container
|   2.1 styles: elements
|   2.2 styles: classes
|   2.3 styles: forms
|   2.4 styles: tooltips
|   2.5 styles: nav
|   2.6 styles: mufuplay
|   2.7 styles: galerie
|   
|   
================================================================================*/


/* 
|
|   0 - browser reset
|
--------------------------------------------------------------------------*/
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
    margin:         0;
    padding:        0;
    border:         0;
    outline:        0;
    font-weight:    inherit;
    font-style:     inherit;
    font-size:      100%;
    font-family:    inherit;
    vertical-align: baseline;
}
:focus {
    outline:        0;
}
ol, ul {
    list-style:     none;
}
table {
    border-collapse:separate;
    border-spacing: 0;
}
caption, th, td {
    text-align:     left;
    font-weight:    normal;
}
blockquote:before, blockquote:after,
q:before, q:after {
    content:        "";
}
blockquote, q {
    quotes:         "" "";
}


/* 
|
|   1.1 - layout: container
|
--------------------------------------------------------------------------*/
body {
    font-family:    Calibri, Verdana, Arial, Helvetica, sans-serif;
    font-size:      75%;
    line-height:    1.6em;
    color:          #333333;
    background:     #dfdfdf url(../gfx/body-bg.jpg);
}
#container {
    width:          782px;
    margin:         0px auto 0px auto;
    position:       relative;
}
#header {
    background:     url(../gfx/header.jpg) no-repeat center top;
    height:         250px;
}
#nav {
    height:         60px;
}
#footer {
    clear:          both;
    background:     url(../gfx/footer-bg.gif) no-repeat center 40px;
    padding:        60px 0 20px 0;
    height:         70px;
    position:       relative;
    color:          #999;
}
#footer img {
    position:       absolute;
    top:            70px;
    right:          0px;
}
#content {
    padding-top:    10px;
}
.with-sub {
    padding-top:    35px !important;
}
.col-main {
    width:          480px;
    float:          left;
    margin:         0 25px 0 0;
}
.col-main-right {
    width:          480px;
    float:          left;
}
.col-gallery {
    width:          490px;
    float:          left;
    margin:         0 15px 0 0;
}
.col-sidebar {
    width:          277px;
    float:          left;
    margin:         2em 0 0 0;
}
.col-sidebar-left {
    width:          277px;
    float:          left;
    margin:         0 25px 0 0;
}
.col-aux {
    width:          582px;
    float:          left;
    margin:         0 0 0 100px;
}
.sidebar-item {
    margin:         0 0 2em 0;
}
.sidebar-form {
    width:          236px;
    background:     url(../gfx/sidebar-form-bg.jpg) no-repeat left top;
    padding:        20px 20px 0 20px;
}
.sidebar-form-footer {
    height:         17px;
    background:     url(../gfx/sidebar-form-bg.jpg) no-repeat left bottom;
}
#abc-show {
    font-size:      6em;
    line-height:    1em;
    text-align:     center;
    color:          #DFDFDF;
    cursor:         pointer;
    background:     #333333
}
#zanmantou {
    margin:         0 0 50px 0;
}
.anounce {
    background:     url(../gfx/anounce-bg.jpg) no-repeat left top;
    padding:        20px 30px 0 30px;
    overflow:       hidden;
}
.anounce-bottom {
    background:     url(../gfx/anounce-bg.jpg) no-repeat left bottom;
    height:         30px;
    margin:         0 0 20px 0;
}


/* 
|
|   2.1 - styles: elements
|
--------------------------------------------------------------------------*/
#content a {
    text-decoration:none;
    border-bottom:  1px dotted #79572a;
    color:          #79572a;
}
#content a:hover {
    background-color:#fdd40a;
    border-bottom:  1px solid #fdd40a;
    color:          #333;
    cursor:         pointer;
}
#footer a {
    text-decoration:none;
    border-bottom:  1px dotted #999999;
    color:          #999999;
}
#footer a:hover {
    border-bottom:  0px;
}
a.blank {
    background-color:transparent !important;
    border:         none !important;
}
p,
#content ul,
#content ol {
    margin:         0 0 2em 0;
}
table {
    margin:         0 0 2em 0;
}
h1 {
    font-family:    Cambria, Georgia, "Times New Roman", Times, serif;
    font-size:      3em;
    line-height:    1em;
    background:     url(../gfx/h1-bg.gif) no-repeat left bottom;
    padding:        0 0 20px 0;
}
div.h1 {
    padding:        0 0 34px 0;
    margin:         0 0 1em 0;
}
/*
div.h1 {
    background:     url(../gfx/h1-wide-blurb.jpg) no-repeat left bottom;
    padding:        0 0 34px 0;
    margin:         0 0 1em 0;
}
div.h1 h1 {
    background:     url(../gfx/h1-wide-blurb.jpg) no-repeat left top;
    padding:        17px 15px 0 15px;
}
.col-main div.h1,
div.h1.h1-col {
    background:     url(../gfx/h1-blurb.jpg) no-repeat left bottom;
}
.col-main div.h1 h1,
div.h1.h1-col h1 {
    background:     url(../gfx/h1-blurb.jpg) no-repeat left top;
}*/
h2 {
    font-family:    Cambria, Georgia, "Times New Roman", Times, serif;
    font-size:      1.6em;
    line-height:    1.2em;
    clear:          both;
    color:          #205C92;
}
h3, h4 {
    font-weight:    bold;
}
strong {
    font-weight:    bold;
}
em {
    font-style:     italic;
    letter-spacing: 0.6px;
}
big {
    float:          left;
}
td {
    padding:        0 10px 0 0;
    vertical-align: top      
}
.more table td {
    padding:        10px 10px 0;
}

/* 
|
|   2.2 - styles: classes
|
--------------------------------------------------------------------------*/
.center {
    text-align:     center !important;
}
a.center {
    margin:         0 auto;
}
.right {
    text-align:     right;
}
.float-left {
    float:          left;
    margin:         0 2em 2em 0;
}
.float-right {
    float:          right;
    margin:         0 0 2em 14px;
}
.offset-top {
    margin-top:     -20px !important;
}
.margin-bottom {
    margin-bottom:  20px !important;
    overflow:       hidden;
}
.pos-right {
    position:       absolute;
    top:            0px;
    right:          0px;
}
.mute {
    font-size:      0.85em;
}
.promo {
    display:        block;
    clear:          both;
}
.blurb {
    display:        block;
    width:          400px;
    height:         77px;
    padding:        30px 26px 0 26px;
    background:     url(../gfx/promo-bg.jpg) no-repeat left top;
}
.blurb span {
    display:        table-cell;
	vertical-align: middle;
    height:         66px !important;
}
.signatur {
    text-align:     right;
    margin:         -2em 0 1em 0;
    color:          #999999;
}
ul.list li,
ol.list li,
div.list {
    background:     url(../gfx/hr-dashed-dotted.gif) repeat-x left bottom !important;
    padding:        10px 0;
}
ol.list {
    list-style:     decimal inside;
}
span.kategorie-wrap {
    display:        block;
    padding:        0 45px 0 0 !important;
}
span.kategorie-active {
    background:     url(../gfx/arrow-03.gif) no-repeat right center !important;
}
.tracks div {
    overflow:       auto;
    height:         250px;
}
div.list {
    margin:         10px 0 0 0;
    position:       relative;
    clear:          both;
}
ul.inline {
    overflow:       hidden;
}
ul#web20linklist {
    height:         40px;
    margin:         10px 0 0 0;
}
ul.inline li {
    display:        inline;
}
ul.inline li a.nav-element{
    float:          left;
}    
.anounce ul.inline {
    margin:         0px !important;
}
.anounce ul.inline li {
    line-height:    2em;
}
#web20links ul.inline li a {
    margin:         0 10px 0 0;
}
dl.inline dt {
    display:        inline;
    font-size:      1.4em;
    font-weight:    bold;
}
dl.inline dd {
    display:        none;
}
.zufallsbild {
    display:        block;
    width:          275px;
    height:         206px;
    background:     url(../gfx/zufallsbild-bg.gif) no-repeat left top;
    position:       relative;
}
.cover-big {
    width:          248px;
    height:         228px;
    background:     url(../gfx/cover-222px-bg.gif) no-repeat left top;
    float:          right;
    margin:         0 0 2em 2em;
    position:       relative;
}
.cover-small {
    display:        block;
    width:          121px;
    height:         112px;
    background:     url(../gfx/cover-107px-bg.gif) no-repeat left top;
    float:          left;
    margin:         0 2em 2em 0;
    position:       relative;
}
.zufallsbild img {
    position:       absolute;
    top:            14px;
    left:           14px;
}
.cover-big img {
    position:       absolute;
    top:            3px;
    right:          5px;
}
.cover-small img {
    position:       absolute;
    top:            3px;
    right:          3px;
}
.termin,
.teaser,
.article {
    padding:        0 0 10px 0;
    background:     url(../gfx/hr-cut.gif) no-repeat left bottom;
    margin:         0 0 40px 0;
    position:       relative;
}
.more {
    background:     url(../gfx/hr-dashed-half.gif) no-repeat left top !important;
    position:       relative;
}
.hidden {
    display:        none;
    visibility:     hidden;
}
.label,
.date,
.time {
    color:          #666;
    font-style:     italic;
}
span.date,
td.date {
    padding:        0 1em 0 0;
}
.anounce a.date {
    font-size:      1.2em;
    font-style:     normal;
}
h3.place {
    font-family:    Consolas, "Courier New", Courier, monospace;
    font-weight:    bold;
    font-size:      1.2em;
    margin:         0 0 1.4em 0;
}
h3.date {
    font-weight:    normal;
    text-align:     right;
    margin:         -0.7em 0 1em 0;
}
td.label {
    width:          80px;
    line-height:    1.1em;
}
table.list tr td {
    background:     url(../gfx/hr-dashed-dotted.gif) repeat-x left bottom !important;
    padding:        10px 10px 10px 0;
}


/* 
|
|   2.3 - styles: forms
|
--------------------------------------------------------------------------*/
.form-01 label,
.form-02 label {
    display:        block;
    float:          left;
    font-family:    Consolas, "Courier New", Courier, monospace;
    font-size:      1.2em;
}
option, optgroup,input, select, textarea {
    font-family:    Consolas, "Courier New", Courier, monospace;
    color:          #205c92;
    border:         0px;
    font-size:      1.2em;
}
select, option {
    background:     #f6f6f6;
}
option, optgroup {
    font-size:      0.9em;
}
.form-01 label {
    width:          90px;
}
.form-02 label {
    width:          56px;
}
.form-01 input,
.form-01 select {
    width:          265px;
    background:     url(../gfx/hr-dashed-slim.gif) repeat-x left bottom;
}
.form-02 input {
    width:          150px;
    background:     url(../gfx/hr-dashed-slim.gif) repeat-x left bottom;
}
textarea {
    padding:        10px;
}
.form-01 textarea {
    width:          268px;
    height:         198px;
    background:     url(../gfx/textarea-bg.gif) no-repeat left top !important;
    margin:         10px 0 0 0;
}
.form-02 textarea {
    width:          178px;
    height:         131px;
    background:     url(../gfx/textarea-02-bg.gif) no-repeat left top !important;
    margin:         0px;
}
.form-01 textarea.error {
    background:     url(../gfx/textarea-error.gif) no-repeat left top !important;
}
.form-02 textarea.error {
    background:     url(../gfx/textarea-02-error.gif) no-repeat left top !important;
}
#f-submit {
    background:     url(../gfx/icon-senden.gif);
    width:          126px;
    margin:         -10px 0 0 76px;
}
#f-ok {
    background:     url(../gfx/icon-ok.gif);
    width:          71px;
    margin:         -10px 0 0 -10px;
}
.sidebar-form #f-ok {
    margin:         0 auto;
}
#f-support {
    background:     url(../gfx/icon-support.gif);
    width:          176px;
    margin:         -10px 0 0 -10px;
}
#f-submit:hover,
#f-ok:hover,
#f-support:hover {
    background-position: left -36px !important;
}
.sidebar-form p {
    margin-bottom:  1em;
}
label.error,
p.error,
span.error {
    color:          #c02d2d;
    font-style:     italic;
}
span.error  {
    display:        block;
    margin-top:     10px;
    line-height:    1.2em;
}
.form-01 span.error  {
    margin-left:    90px;
}
.form-02 span.error  {
    margin-left:    56px;
}
input.error, select.error {
    background:     url(../gfx/hr-dashed-error.gif) repeat-x left bottom;
}
p.success {
    color:          #205C92;
}


/* 
|
|   2.4 - styles: tooltips
|
--------------------------------------------------------------------------*/
.tooltip {
    background:     url(../gfx/tooltip-bg.gif) no-repeat left top !important;
    width:          114px;
    height:         105px;
}
.titletip {
    background:     url(../gfx/titletip-bg.gif) no-repeat left top !important;
    width:          77px;
    height:         61px;
    padding:        10px 10px 0 10px;
    line-height:    1em;
    text-align:     center;
    color:          #FDD40A;
}
.tooltip .tip,
.titletip .tip-text {
    display:        none;
}


/* 
|
|   2.5 - styles: nav
|
--------------------------------------------------------------------------*/
.nav-element {
    display:        block;
    height:         0px !important;
    padding:        60px 0 0 0; /* kann evtl. raus? */
    overflow:       hidden;
    background-position: left top;
    background-repeat: no-repeat;
    border:         0px !important;
}
.button-element {
    display:        block;
    overflow:       hidden !important;
    background-position: left top;
    background-repeat: no-repeat;
    border:         0px !important;
    text-indent:    1000px;
    height:         36px;
    padding:        36px 0 0 36px;
    cursor:         pointer;
}
#nav-main {
    position:       absolute;
    z-index:        10 !important;
}
#nav-main li {
    display:        inline;
    overflow:       hidden;
}
#nav-main li a {
    display:        block;
    height:         0px !important;
    padding:        33px 0 0 0;
    overflow:       hidden;
    background-position: left top;
    background-repeat: no-repeat;
    float:          left;
}
#nav-main li a:hover,
#nav-main li a.active,
#nav-main li a.closed {
    background-position: left -33px !important;
}
#nav-main li a.open:hover{
    background-position: left 0px !important;
}
#nav-home {
    background:     url(../gfx/nav-home.gif);
    width:          74px;
}
#nav-band {
    background:     url(../gfx/nav-band.gif);
    width:          63px;
}
#nav-termine {
    background:     url(../gfx/nav-termine.gif);
    width:          107px;
}
#nav-kontakt {
    background:     url(../gfx/nav-kontakt.gif);
    width:          102px;
}
#nav-media {
    background:     url(../gfx/nav-media.gif);
    width:          74px;
}
#nav-texte {
    background:     url(../gfx/nav-texte.gif);
    width:          84px;
}
#nav-laden {
    background:     url(../gfx/nav-laden.gif);
    width:          76px;
}
#nav-gaestebuch {
    background:     url(../gfx/nav-gaestebuch.gif);
    width:          131px;
}
#nav-links {
    background:     url(../gfx/nav-links.gif);
    width:          70px;
}
.nav-sub {
    position:       absolute;
    z-index:        -10 !important;
}
.nav-sub li a {
    padding:        20px 0 0 0 !important;
}
#nav-main .nav-sub li a:hover,
#nav-main .nav-sub li a.active {
    background-position: left -20px !important;
}
#nav-sub-band {
    top:            0px;
    left:           10px;
    width:          315px;
    height:         72px;
    background:     url(../gfx/nav-band-sub.gif) no-repeat left top;
    padding:        44px 0 0 10px;
}
#nav-sub-media {
    top:            0px;
    left:           298px;
    width:          233px;
    height:         67px;
    background:     url(../gfx/nav-media-sub.gif) no-repeat left top;
    padding:        44px 0 0 10px;
}
#nav-sub-laden {
    top:            2px;
    left:           444px;
    width:          216px;
    height:         66px;
    background:     url(../gfx/nav-laden-sub.gif) no-repeat left top;
    padding:        44px 0 0 10px;
}
#nav-band-bio {
    background:     url(../gfx/nav-band-bio.gif);
    width:          84px;
}
#nav-band-steckbriefe {
    background:     url(../gfx/nav-band-steckbriefe.gif);
    width:          111px;
}
#nav-band-diskografie {
    background:     url(../gfx/nav-band-diskografie.gif);
    width:          115px;
}
#nav-media-presse {
    background:     url(../gfx/nav-media-presse.gif);
    width:          63px;
}
#nav-media-audio {
    background:     url(../gfx/nav-media-audio.gif);
    width:          53px;
}
#nav-media-video {
    background:     url(../gfx/nav-media-video.gif);
    width:          54px;
}
#nav-media-bilder {
    background:     url(../gfx/nav-media-bilder.gif);
    width:          52px;
}
#nav-laden-derladen {
    background:     url(../gfx/nav-laden-derladen.gif);
    width:          92px;
}
#nav-laden-dasladen {
    background:     url(../gfx/nav-laden-dasladen.gif);
    width:          99px;
}
#nav-jannis {
    background:     url(../gfx/icon-jannis.gif);
    width:          170px;
}
#nav-lenne {
    background:     url(../gfx/icon-lenne.gif);
    width:          170px;
}
#nav-tom {
    background:     url(../gfx/icon-tom.gif);
    width:          170px;
}
#nav-martin {
    background:     url(../gfx/icon-martin.gif);
    width:          170px;
}
#nav-rss-news {
    background:     url(../gfx/icon-rss-news.gif);
    width:          169px;
    padding:        75px 0 0 0;
    margin-top:     50px; 
}
#nav-rss-termine {
    background:     url(../gfx/icon-rss-termine.gif);
    width:          169px;
    padding:        75px 0 0 0;
}
#nav-texte-akkorde {
    background:     url(../gfx/icon-texte-akkorde.gif);
    width:          214px;
    padding:        23px 0 0 0;
}
#icon-band-auf-bank {
    background:     url(../gfx/icon-band-auf-bank.gif);
    width:          260px;
    height:         201px;
    margin:         0 0 0 10px;
}
#web20links:hover #icon-band-auf-bank {
    background-position: left -201px !important;
}
#nav-myspace {
    background:     url(../gfx/icon-myspace.gif);
    width:          81px;
    padding:        32px 0 0 0;
}
#nav-youtube {
    background:     url(../gfx/icon-youtube.gif);
    width:          81px;
    padding:        32px 0 0 0;
}
#nav-facebook {
    background:     url(../gfx/icon-facebook.gif);
    width:          81px;
    padding:        32px 0 0 0;
}
.nav-arrow {
    background:     url(../gfx/icon-arrow.gif);
    width:          59px;
    padding:        33px 0 0 0;
}
#nav-band-mit-namen-jannis {
    background:     url(../gfx/icon-band-mit-namen.jpg) no-repeat 0px 0px;
    width:          124px;
    padding:        249px 0 0 0;
}
#nav-band-mit-namen-lenne {
    background:     url(../gfx/icon-band-mit-namen.jpg) no-repeat -124px 0px;
    width:          59px;
    padding:        249px 0 0 0;
}
#nav-band-mit-namen-martin {
    background:     url(../gfx/icon-band-mit-namen.jpg) no-repeat -183px 0px;
    width:          76px;
    padding:        249px 0 0 0;
}
.nav-control {
    width:          86px;
    padding:        43px 0 0 0;
}
#nav-control-prev {
    background:     url(../gfx/control-prev.gif) no-repeat 0px 0px;
}
#nav-control-next {
    background:     url(../gfx/control-next.gif) no-repeat 0px 0px;
}
#nav-control-top {
    background:     url(../gfx/control-top.gif) no-repeat 0px 0px;
}
.promo-toggler {
    background:     url(../gfx/icon-promo.gif) no-repeat 0px 0px;
    width:          140px;
    padding:        20px 0 0 0;
    float:          right;
    margin:         -1.4em 10px 0 0;
}
.promo-kaufen {
    background:     url(../gfx/promo-kaufen.gif) no-repeat 0px 0px;
    width:          171px;
    padding:        73px 0 0 0;
    float:          left;
}
.promo-laden {
    background:     url(../gfx/promo-laden.gif) no-repeat 0px 0px;
    width:          172px;
    padding:        75px 0 0 0;
    float:          left;
}
.promo-gratis-laden {
    background:     url(../gfx/promo-gratis-laden.gif) no-repeat 0px 0px;
    width:          172px;
    padding:        75px 0 0 0;
    float:          left;
}
.nav-element:hover {
    background-position: left -60px !important; /* kann evtl. raus? */
}
#nav-rss-termine:hover,
#nav-rss-news:hover {
    background-position: left -75px !important;
}
#nav-texte-akkorde:hover {
    background-position: left -23px !important;
}
#nav-myspace:hover,
#nav-youtube:hover,
#nav-facebook:hover {
    background-position: left -32px !important;
}
.nav-arrow:hover {
    background-position: left -33px !important;
}
#nav-band-mit-namen-jannis:hover {
    background-position: 0px -249px !important;
}
#nav-band-mit-namen-lenne:hover {
    background-position: -124px -249px !important;
}
#nav-band-mit-namen-martin:hover {
    background-position: -183px -249px !important;
}
#nav-control-prev:hover,
#nav-control-next:hover,
#nav-control-top:hover {
    background-position: 0px -43px !important;
}
.promo-toggler:hover {
    background-position: 0px -20px !important;
}
.promo-kaufen:hover {
    background-position: 0px -73px !important;
}
.promo-laden:hover,
.promo-gratis-laden:hover {
    background-position: 0px -75px !important;
}


/* 
|
|   2.6 - styles: mufuplay
|
--------------------------------------------------------------------------*/
.mufuplay {
    position:       relative;
    height:         400px;
    
}
#nav-mufuplay {
    background:     url(../gfx/mufuplay-bg.gif) left top;
    width:          269px;
    padding:        379px 0 0 0;
    height:         0px;
    position:       absolute;
    top:            0px;
    left:           0px;
    z-index:        10 !important;
}
#mufuplay-cover {
    position:       absolute;
    top:            63px;
    left:           17px;
    z-index:        0 !important;
}
#mufuplay-kaufen {
    background:     url(../gfx/mufuplay-kaufen.gif);
    width:          128px;
    padding:        97px 0 0 0;
    z-index:        20 !important;
}
.mufuplay #mufuplay-kaufen {
    position:       absolute;
    top:            220px;
    left:           0px;
}
.tracks #mufuplay-kaufen {
    position:       absolute;
    top:            0px;
    left:           -20px;
    z-index:        120 !important;
}
#mufuplay-laden {
    background:     url(../gfx/mufuplay-laden.gif);
    width:          114px;
    padding:        87px 0 0 0;
    z-index:        20 !important;
    position:       absolute;
    top:            224px;
    right:          20px;
}
#mufuplay-hoeren {
    background:     url(../gfx/mufuplay-hoeren.gif);
    width:          95px;
    padding:        86px 0 0 0;
    z-index:        20 !important;
    position:       absolute;
    top:            290px;
    left:           90px;
}
.nav-mufuplay-hover {
    background-position: left -379px !important;
}
#mufuplay-kaufen:hover {
    background-position: left -97px !important;
}
#mufuplay-laden:hover {
    background-position: left -87px !important;
}
#mufuplay-hoeren:hover {
    background-position: left -86px !important;
}


/* 
|
|   2.7 - styles: galerie
|
--------------------------------------------------------------------------*/
.polaroid {
    width:          490px;
    background:     url(../gfx/polaroid-top.jpg) no-repeat left top;
}
.polaroid img {
    margin:         30px 30px 15px 30px;
}
.polaroid-title {
    width:          420px;
    height:         68px;
    background:     url(../gfx/polaroid-bottom.jpg) no-repeat left top;
    padding:        20px 35px 10px 35px;
    overflow:       hidden;
    line-height:    1.1em;
    font-style:     italic;
    color:          #205C92;
}
.controls {
    padding-bottom: 4px;    
    background:     url(../gfx/hr-dashed-half.gif) repeat-x left bottom;
    margin-bottom:  40px;
}
.album {
    display:        block;
    float:          left;
    cursor:         pointer;
    margin:         10px 6px 0 0;
}
.album-quer {
    width:          195px;
    height:         226px;
    padding:        25px 30px 0 28px;
}
.album-quer-01 {
    background:     url(../gfx/alben-quer-01.jpg) no-repeat left top;
}
.album-quer-02 {
    background:     url(../gfx/alben-quer-02.jpg) no-repeat left top;
}
.album-quer-03 {
    background:     url(../gfx/alben-quer-03.jpg) no-repeat left top;
}
.album img {
    margin:         0 0 13px 0;   
}
.album-title {
    line-height:    1.1em;
    font-style:     italic;
    color:          #205C92;
}
.album:hover.album-quer-01 {
    background:     url(../gfx/alben-quer-02.jpg) no-repeat left top;
}
.album:hover.album-quer-02 {
    background:     url(../gfx/alben-quer-03.jpg) no-repeat left top;
}
.album:hover.album-quer-03 {
    background:     url(../gfx/alben-quer-01.jpg) no-repeat left top;
}