/* 
ACHTUNG: Der Magazin Teaser wird in abgeanderter From auch auf der 20min Mobile Startseite verwendet! Bei Aenderungen dort auch kontrollieren! 
*/

/* MAGAZIN TEASER */
.box.magazin {
padding:0px;
width:960px;
overflow:hidden;
margin-bottom:-115px;
background-repeat:no-repeat;
position:relative;
}

/*Magazin/Themabox sind eine grid höhe höher als eigentlich platziert (overflow)*/
.box.magazin.x43, .box.magazin.x83, .box.magazin.x43 .teaser, .box.magazin.x83 .teaser{
height:475px;
}
.box.magazin.x42, .box.magazin.x82, .box.magazin.x42 .teaser, .box.magazin.x82 .teaser{
height:235px;
}
.box.magazin.x41, .box.magazin.x81, .box.magazin.x41 .teaser, .box.magazin.x81 .teaser{
height:120px;
}

.box.magazin h1 span, .box.magazin h2 span  {
text-indent:-10000px;
overflow:hidden;
display:block;
width:1px;
height:1px;
line-height:1px;
}

.box.magazin .teaser {
background-color:transparent;
background-image:url(http://www.20min.ch/2010/img/magazin/magazinteaser_fade.png);
background-repeat:repeat-x;
background-position:bottom;
margin: 0px 10px 0px 0px;
}

.box.magazin .magazin_text {
position:relative;
display:block;
top:50px;
font-family:Georgia, "Times New Roman", Times, serif;
font-size:20px;
color:#ffffff;
margin:0px;
padding:10px;
width:60%;
cursor: pointer;
}

.box.x41.magazin .magazin_text {
top:30px;
}

.box.x41.magazin .magazin_text p {
display: none;
}

.box.magazin .teaser.alt_align1 .magazin_text {
float: right !important;
}

.box.magazin .teaser.bg_fade .magazin_text {
background-image:url(http://www.20min.ch/2010/img/magazin/bg_black.png);
}

.box.magazin .teaser.alt_color1 .magazin_text {
color:#000000;
}

.box.magazin .teaser.alt_color1.bg_fade .magazin_text {
background-image:url(http://www.20min.ch/2010/img/magazin/bg_white.png);
}

.box.magazin .magazin_text p {
display:block;
width:auto;
margin-right:40px;
margin-left:0px;
}

.box.magazin h1 img {
margin-bottom:15px;
}

.x43.box.magazin h1 img, .x42.box.magazin h1 img, .x41.box.magazin h1 img {
margin-bottom:5px;
}

.box.magazin a.imgLink {
position: relative;
display:block;
width:950px;
height:336px;
padding:0px;
margin:0px;
background-image:none;
}

.box.magazin .label {
position:relative;
top:336px;
height:24px;
width:225px;
margin-left:10px;
background-color:#000000;
color:#ffffff;
float:left;
font-family:Georgia, "Times New Roman", Times, serif;
font-weight:bold;
text-transform:uppercase;
font-size:16px;
line-height:24px;
padding:0px 0px 0px 5px;
}

.box.magazin .label.l1 {
margin-left:0px;
}

/* show and hide labels depending on the layout */
/* l211 */
.box.magazin .teaser.l211 .l4 {
display:none;
}

.box.magazin .teaser.l211 .l1 {
width:465px;
}

/* l112 */
.box.magazin .teaser.l112 .l4 {
display:none;
}

.box.magazin .teaser.l112 .l3 {
width:465px;
}

/* l22 */
.box.magazin .teaser.l22 .l3, .box.magazin .teaser.l22 .l4 {
display:none;
}

.box.magazin .teaser.l22 .l1, .box.magazin .teaser.l22 .l2 {
width:465px;
}

/* l0 */
.box.magazin .teaser.l0 .label {
display:none;
}

.box.magazin .teaser.l0 {
/*height:350px;*/
overflow:hidden;
margin-bottom:10px !important;
}

.box.magazin .teaser.l0 .teaser a {
/*height:350px;*/
}

.box.magazin .teaser.l0 .teaser a img {
/*height:350px;*/
}

/* layouts with holes */
/* l200 */
.box.magazin .teaser.l200 .l1 {
width:465px;
}

.box.magazin .teaser.l200 .l2, .box.magazin .teaser.l200 .l3, .box.magazin .teaser.l200 .l4 {
display:none;
}

/* l210 */
.box.magazin .teaser.l210 .l3, .box.magazin .teaser.l210 .l4 {
display:none;
}

.box.magazin .teaser.l210 .l1 {
width:465px;
}

/* l1110 */
.box.magazin .teaser.l1110 .l4 {
display:none;
}

/* l1100 */
.box.magazin .teaser.l1100 .l3, .box.magazin .teaser.l1100 .l4 {
display:none;
}

/* l1000 */
.box.magazin .teaser.l1000 .l2, .box.magazin .teaser.l1000 .l3, .box.magazin .teaser.l1000 .l4 {
display:none;
}

/* IE6 Hacks fuer Magazin Teaser */
*html .box.magazin {
height:360px;
margin-bottom:0px;
}

*html .box.magazin h1 span{
text-indent:0px;
display:inline;
width:auto;
height:auto;
line-height:48px;
font-size:44px;
font-weight:bold;
}

*html .box.magazin h2 span  {
text-indent:0px;
display:inline;
width:auto;
height:auto;
line-height:28px;
font-size:24px;
font-weight:bold;
}

*html .box.magazin .teaser {
overflow:hidden;
}

*html .box.magazin .teaser.bg_fade .magazin_text {
background:none;
background-color:#000000;
filter:alpha(opacity=80);
}

*html .box.magazin .teaser.bg_fade.alt_color1 .magazin_text {
background:none;
background-color:#ffffff;
filter:alpha(opacity=80);
}

*html .box.magazin .magazin_text p { 
margin-right:0px;
}

*html .box.magazin h1 img, *html .box.magazin h2 img {
display:none;
}
/* END: MAGAZIN TEASER */


/* GRUPPIER BOX */
.groupper {
display:block;
background-image: url("/2010/img/magazin/groupper-color.png");
background-repeat: repeat-y;
width:480px;
position:relative;
float:none !important;
clear:both;
}

.groupper .box.left .teaser .teaser_title, .groupper .box.left .teaser_text, .groupper .box.left .teaser_media, .groupper .box.left .teaser_thematiclinks {
margin: 0px 0px 0px 6px;
}

.groupper .box.right .teaser .teaser_title, .groupper .box.right .teaser_text, .groupper .box.right .teaser_media, .groupper .box.right .teaser_thematiclinks {
margin: 0px 6px 0px 0px;
}

.groupper .box.full .teaser .teaser_title, .groupper .box.full .teaser_text, .groupper .box.full .teaser_media, .groupper .box.full .teaser_thematiclinks {
margin: 0px 6px;
}

.groupper .endgroupper {
width: 470px;
height: 9px;
border-top: 1px solid #CCCCCC;
background-color: #FFFFFF;
position: absolute;
bottom: 0;
left: 0;
}

.groupper .box.magazin {
height: 240px;
width: 480px;
overflow: hidden;
margin: 0px;
position: static;
}

.groupper .box.x41.magazin {
height: 120px;
width: 480px;
overflow: hidden;
margin: 0px;
position: static;
}

.groupper .box.magazin .teaser {
background-image:url(/2010/img/magazin/groupperteaser_fade.png);
border-top:1px solid #CCCCCC;
}

.groupper .box.x41.magazin .teaser {
background-image:url(/2010/img/magazin/groupperteaserx41_fade.png);
}

.groupper .box.magazin .magazin_text {
width: auto;
max-width: 60%;
float: left;
font-size: 16px;
}

.groupper .box.magazin .magazin_text p {
margin-right:20px;
}

.groupper .box.magazin a {
display:block;
width:470px;
height:234px;
padding:0px;
margin:0px;
background-image:none;
}

/* IE6 Hacks fuer Gruppier Box */
*html .groupper .box.magazin .teaser {
background-image:none;
}

*html .groupper .box.magazin .magazin_text {
width: 60%;
}

*html .teaser.alt_align1 .magazin_text {
float: right;
}
/* END: GRUPPIER BOX */