/* Import external styles */

@import url("reset.css");
@import url("text.css");
@import url("960.css");
@import url("skin.css");
@import url("color.css");


body{
  background-color:#000;
  
  }

  .innerPage { width:960px !important; margin:0; min-height:100%;}
  .container_12{ min-height:100%;}
/*
  Header
--------------------------- */

#header{
  height:168px;
  margin-bottom:25px;
  position:relative;
  }
  
  #header h1{
    position:relative;
    width:347px; height:90px;padding-top:22px; margin-bottom:24px;
    float:left;
    }
    #header h1 a.logo{
      display:block;
      width:280px; height:90px;
      text-indent:-9999px;
      background:url(img/logo.jpg) top left no-repeat;
      outline:none;
      }
    #header h1 span{
      display:block; position:absolute; top:0; right:0;
      width:90px; height:91px;
      text-indent:-9999px;
      background:url(img/badge_beta.png) 0 0 no-repeat;
      }
      
  /* Right Header Box ----------- */

  #loginHolder{
    position:relative;
    overflow:hidden;
    float:right;
    width:470px;
    }
    #loginHolder ul{
      overflow:hidden;
      padding-top:17px;margin-bottom:9px;
      }
      #loginHolder ul li{
        float:left; display:inline;
        padding-top:17px;padding-right:9px;
        }
        #loginHolder ul li a{
          font-size:10px; line-height:20px;
          }
             
    #loginHolder a.fbLink{
      position:absolute; top:20px; right:90px;
      display:block;
      width:39px; height:39px;
      text-indent:-9999px;
      background:url(img/fb.jpg) left center no-repeat;
      }
    #loginHolder a.tweetLink{
      position:absolute; top:20px; right:50px;
      display:block;
      width:39px; height:39px;
      text-indent:-9999px;
      background:url(img/tweet.jpg) left center no-repeat;
      }
    #loginHolder a.rssLink{
      position:absolute; top:20px; right:10px;
      display:block;
      width:31px; height:38px;
      text-indent:-9999px;
      background:url(img/rss.jpg) left center no-repeat;
      }
          
    #loginHolder form{
      display:block;
      padding:8px 0;
      background:#000;
      }
      #loginHolder form label{
        font-size:10px;color:#FFF; line-height:20px;
        }
      #loginHolder form input{
        width:138px; height:20px;margin-left:12px;
        cursor:text;
        }
        #loginHolder form input.searchButton{
          width:21px; height:21px;
          border:none;
          background:url(img/search_button.jpg) 0 0 no-repeat;
          }
    
/*
  Main Navigation
  @TODO use border instead of images @michael
--------------------------- */
  
.mainNavigation {
    width:940px; 
    margin:0 auto;
}

.mainNavigation li{
    float:left; position:relative;
    padding-right:6px;
}

.mainNavigation a{
    display:block;
    background-position:bottom left;
    background-repeat:repeat-x;
    padding:8px 0 6px 0;
    font-size:15px;
    font-weight:bold; 
    line-height:18px;
}

.colordefaultLink a, 
.mainNavigation .colordefaultLink ul,
.colordefault .breadcrumbs .active a {background-color:#333;}

.redLink a, 
.mainNavigation .redLink ul,
.red .breadcrumbs .active a {background-image:url(img/border_red.jpg);}

.grayLink a,
.mainNavigation .grayLink ul,
.gray .breadcrumbs .active a {background-image:url(img/border_gray.jpg);}

.blueLink a,
.mainNavigation .blueLink ul,
.blue .breadcrumbs .active a {background-image:url(img/border_blue.jpg);}

.yellowLink a,
.mainNavigation .yellowLink ul,
.yellow .breadcrumbs .active a {background-image:url(img/border_yellow.jpg);}

.tirkizLink a,
.mainNavigation .tirkizLink ul,
.tirkiz .breadcrumbs .active a {background-image:url(img/border_tirkiz.jpg);}

.pinkLink a,
.mainNavigation .pinkLink ul,
.pink .breadcrumbs .active a {background-image:url(img/border_pink.jpg);}

.purpleLink a,
.mainNavigation .purpleLink ul,
.purple .breadcrumbs .active a {background-image:url(img/border_purple.jpg);}

.greenLink a,
.mainNavigation .greenLink ul,
.green .breadcrumbs .active a {background-image:url(img/border_green.jpg);}

.orangeLink a,
.mainNavigation .orangeLink ul,
.orange .breadcrumbs .active a{background-image:url(img/border_orange.jpg);}

.azureLink a,
.azureLink ul,
.azure .active a{border-bottom: 6px solid #3399CC; padding-bottom: 0;}
      
.mainNavigation a:hover {
    text-decoration:none;
    background-position:top left;
}

.mainNavigation .active a{
    text-decoration:none;
    background-position:top left;
}

.mainNavigation .azureLink a:hover,
.mainNavigation .active .azureLink {
    border-top: 6px solid #3399CC;
    border-bottom: none;
    padding: 2px 0 6px 0;
}
      
/*
Dropdown menu list
*/
.mainNavigation li ul {
    display:none; 
    position:absolute; 
    left:0; 
    top:32px; 
    z-index:100; 
    padding:4px 7px 0 7px;
    background-repeat:repeat; 
}

.mainNavigation .azureLink ul {
    border: none;
    background-color: #3399CC;
    top: 26px;
    margin: 6px 0 0 0;
}

.mainNavigation li:hover ul {
    display:block;
    min-width:91px;
}

.mainNavigation ul li {
    float:none; display:block;
    padding:0 0 4px 0;
    background:none;
    white-space:nowrap;
 }

.mainNavigation ul a {
    padding:0;
    font-size:12px; color:#fff; font-weight:normal;
    background:none;
}

.mainNavigation .azureLink ul a {border: none;}
.mainNavigation ul a:hover {text-decoration:underline;}
.mainNavigation .azureLink ul a:hover {
    padding: 0; 
    border-top: none;
}
      
      
      
    /*
    other Lists
     */     
      
      .bolder li a{
        font-size:15px; line-height:18px; font-weight:bold; 
        }
      
      /*ul.mainNavigation li.active a{
        padding:6px 2px;
        background-repeat:repeat;
        color:#FFF;
        }*/
      .filmsList{
        padding-left:10px; padding-bottom:100px;
        }
      .filmsList li{
        padding-bottom:16px;
        }
      .filmsList li h5{
          font-size:15px; line-height:18px; font-weight:bold;
          
          }
      .filmsList li a{
            padding-right:15px;
            background:url(img/black_arrow.jpg) center right no-repeat;
            margin-right:5px;
            }
      .filmsList span{
              font-size:12px; line-height:14px;
              }
          
            
  /* Breadcrumbs ----------- */
  
  .breadcrumbs{
    overflow:hidden;
    width:940px;
    margin-bottom:48px;
    padding-left:10px;
    }
    .breadcrumbs li{
      float:left; display:inline;
      padding-left:5px;
      }
      .breadcrumbs li a{
        font-size:15px;
        display:inline-block; zoom:1; *display:inline;
        padding:2px 0;
        }
      .breadcrumbs li.active a {
        background-repeat:repeat;
        color:#FFF;
        padding:2px;
        }
        .breadcrumbs li.active a:hover {
          text-decoration:none;}
          
          
    /* Pagination ----------- */      
          
    ul.pagination{
      float:right;
      margin:20px 0;
      }
    ul.pagination li{
      padding:0 5px;
      float:left;
      }
    ul.pagination li a{
      font-size:20px; line-height:20px;
      }
    ul.pagination li.activePage a{
        font-weight:bold;
      }
    li.next a{
      display:block;
      width:20px; height:20px; 
      background:url(img/black_arrow_next.jpg) center center no-repeat;
      text-indent:-9999px;
      } 
    li.previous a{
      display:block;
      width:20px; height:20px; 
      background:url(img/black_arrow_previous.jpg) center center no-repeat;
      text-indent:-9999px;
      } 
      
            
/*
  Content Boxes
--------------------------- */      
      
ul.articleList li{
  overflow:hidden;
  margin-bottom:30px;
  position:relative;
  }
  ul.articleList li ul li{
    margin-bottom:0;
  }
  ul.articleList li a:hover {
    text-decoration:none;
    }
    ul.articleList li h2{
      line-height:30px;
    }
    
  ul.blogList{
    padding-left:40px; padding-top:40px; padding-right:50px;
    }
    ul.bookList{
       padding-top:40px;
       
      }
    
    /* Left Article boxes */
    .infoImage{
      float:left;
      position:relative;
      padding-right:15px;
      }
      .level-1 .infoImage {width:430px;}
      .level-1 .moreLink  {left:445px;}
      .level-2 .infoImage {width:310px;}
      .level-2 .moreLink  {left:325px;}
      .level-3 .infoImage {width:230px;}
      .level-3 .moreLink  {left:245px;}
      .level-4 .infoImage {width:150px;}
      .level-4 .moreLink  {left:165px;}
      .level-6 .infoImage {width:230px;}
      .level-6 .moreLink  {left:245px;}
      .level-7 .infoImage {width:350px;}
      .level-7 .moreLink  {left:370px;}
      .level-7 .blogAuthor {left:370px; bottom:0px;}
      .level_8 .infoImage {width:150px;}
      .level-8 .moreLink  {left:165px;}
      
      .innerInfoImage {
        float:right; position:relative;
        }
      
      .infoImage img{
        float:right;
        }
      .infoImage h4{
        float:none!important;
        padding-left:10px;
        }
      .rightImage {
        float:right;
        }
        .rightImage .badgeHolder{
          position:absolute; top:-20px; right:0px; z-index:5;
                    padding-top: 28px;
          }
        .audio{
          display:block;width:41px; height:41px;
          position:absolute; top:5px; left:5px;
          
          }
          .audioSmall{
            width:26px; height:26px;
            position:absolute; top:3px; left:3px;
            }
                .foto{
                    display:block;width:41px; height:41px;
                    position:absolute; top:5px; left:5px;
                    
                    }
                    .fotoSmall{
                        width:26px; height:26px;
                        position:absolute; top:3px; left:3px;
                        }
        .video{
          display:block;width:41px; height:41px;
          position:absolute; top:5px; left:5px;
          }
          .videoSmall{
            width:26px; height:26px;
            position:absolute; top:3px; left:3px;
            }
        .leftPadding {
          padding-left:40px;
          } 
          
    
    /* Right Article boxes */
    .infoText{
      float:right;
      position:relative;
      overflow:hidden;
      margin-bottom:18px;
      }
      .level-1 .infoText {width:175px;}
      .level-2 .infoText {width:295px; height:176px;}
      .level-3 .infoText {width:375px; height:123px;} 
      .level-4 .infoText {width:135px; height:71px;}
        .level-4 .infoText h2, .level-4 .infoText h3{font-size:13px; line-height:23px !important; margin-bottom:0px;}
        .level-4 .infoText h3{line-height:15px !important; margin-bottom:9px;}
      .level-5 .infoText{width:290px !important;}
        .level-5 .infoText h2{font-size:13px;}
        .level-5 .infoText h3{font-size:13px; margin-bottom:0px;}
        .level-5 .infoText a:hover {text-decoration:none;}
      .level-6 .infoText {width:195px; height:124px;}
        .level-6 .infoText h2{font-size:16px; margin-bottom:0px;}
        .level-6 .infoText h3{font-size:15px; margin-bottom:0px; color:#000;}
      .level-7 .infoText {width:480px; height:152px;} 
      .level-8 .infoText {width:295px; height:187px;} 
        
      
      .moreLink{
        display:block;
        width:11px;height:16px;
        position:absolute; bottom:0px;
        cursor:pointer;
        text-indent:-9999px; outline:none;
        }       
        
      .badgeHolder, .badgeHolderStar{
        position:absolute; top:10px; right:28px; z-index:5;
        width:73px; height:50px;
        padding-top:23px;
        color:#FFF; font-size:12px; line-height:14px; font-weight:bold; text-align:center;
        }
      .badgeHolderStar{
        width:112px; height:108px; padding-top:0px;
        background:url(img/film_star.png) 0 0 no-repeat; text-indent:-9999px;
        }
      h3 span{ float:left;}
      
      .starsRate{
        margin-left:10px;
        line-height:12px;
        display:block; 
        height:12px;
        float:left;
        width: 64px;
      }    
      .Stars5{
        background:url(img/5_blue_stars.jpg) 0 0 no-repeat;
      }
      .Stars4{
        background:url(img/4_blue_stars.jpg) 0 0 no-repeat;
      }
      .Stars3{
        background:url(img/3_blue_stars.jpg) 0 0 no-repeat;
      }
      .Stars2{
        background:url(img/2_blue_stars.jpg) 0 0 no-repeat;
      }
      .Stars1{
        background:url(img/1_blue_stars.jpg) 0 0 no-repeat;
      }
      .Stars0{
        background:url(img/0_blue_stars.jpg) 0 0 no-repeat;
      } 
        
          
        
      .smallBadgeHolder{
        position:absolute; top:5px; left:5px; z-index:5;
        width:43px; height:33px;
        padding-top:10px;
        color:#FFF; font-size:12px; line-height:14px; font-weight:bold; text-align:center;
        font-size:9px; line-height:10px;
        }
      .forumFeedback{
        position:absolute; top:0; right:0px;
        display:block;
        width:84px; height:100px;
        background:url(img/forum_feedback.png) 0 0 no-repeat;
        text-indent:-9999px;
        }
      .forumBuch{
        position:absolute; top:0; right:30px;
        display:block;
        width:83px; height:94px;
        background:url(img/forum_buch.png) bottom left no-repeat;
        text-indent:-9999px;
        }
        
      .azFilms{
        position:absolute; bottom:0px; right:80px;
        display:block;
        width:84px; height:100px;
        background:url(img/film_linkicon.png) bottom left no-repeat;
        text-indent:-9999px;
        z-index:6;
        }
  

/*
  Sidebar Content
--------------------------- */
        
#rightColumn{
  overflow:hidden;
  }
  ul.sidebar li{
    overflow:hidden;
    position:relative;
    margin-bottom:30px;
        padding-bottom: 20px;
        border-bottom: 1px solid #000000;
    }
  ul.sidebar li.overflowFix {
    overflow:visible;
     width:300px;
    }
    ul.sidebar li ul li{
      margin-bottom:0;
    }
    ul.sidebar li.forumLinks{
      padding-top:20px; padding-bottom:40px;
      }
    ul.sidebar li .infoImage{
      margin-bottom:0px;
    }
    ul.sidebar li h4{
      padding-left:11px;
    }
    ul.sidebar li p {
      padding:0 11px;
    }
  
    .arrowList{
        padding-top:11px;
        }
        
        .sidebar .arrowList {width: 230px}
        
        .addTopMargin {
            margin-top:20px;
            }
        .arrowList li{
            padding-left:16px; padding-bottom:8px !important;
            background:url(img/listitem_arrow.png) left 4px no-repeat;
            border-bottom:0 !important;
        }
            ul.paddingFix li {
                padding-bottom:3px !important;
                }
        .arrowList li span {
            font-size:12px; line-height:20px;
            }
        .arrowList li a{
            font-size:12px; text-transform:uppercase;line-height:20px;
            }
    ul.sidebar li.sidebarImages{
        padding:15px 15px;
        }   
    .sidebarImages .infoImage{
        padding-bottom:20px;
        }
        
    .sidebarImages img{
        float:left;
        padding-right:7px;
        }
        ul.sidebar li.sidebarImages p{padding:0 0 40px 0}
      
/* external links list ----------- */
  .extLinks li{
    padding-top:8px; padding-left: 70px; padding-bottom: 70px;
    border-top:1px solid #000;
    }
    .extLinks li.bigPadding{
      padding-bottom:198px;
      }
    .extLinks li div{
      width:142px;
      padding-bottom:20px;
      position:relative;
      
      }
      .extLinks li div h3, .extLinks li div i {
        font-size:10px; line-height:12px; color:#000; font-style:italic;
        }
        
      .extLinks li div a.moreLink{
        background:url(img/listitem_arrow.png) 0 0 no-repeat;
        }
      
  
/* Black Content Boxes ----------- */ 
.black{
  width:280px;
  padding:10px 11px;
  background:#000;
  }
  .black h4{
    float:left;
    color:#fff;
    }
  .black p{
    color:#FFF; 
    }
  .black  ul.arrowList{
    float:left;
    }
    .black .arrowList li{
      background:url(img/listitem_whitearrow.png) left center no-repeat;
      }
      .black .arrowList li a{
        color:#FFF;
        }
        
  .badgeLogo{
    position:absolute;
    float: right;
    margin-top: -45px;
    margin-right: -50px;
    width:58px; height:52px;
    background:url(img/ppb_logo.jpg) top right no-repeat;
    text-indent:-9999px;
    }
    
  .forumFokus{
    position:absolute; top:10px; right:70px;
    width:79px; height:82px;
    background:url(img/forum_fokus.png) 0 0 no-repeat;
    }
    .iconLink{
        float:left;
        margin:20px 20px 0 30px;
        }
    
  .blogAuthor{
    position:absolute;
    
    }
    .blogAuthor img{
      }
      .blogAuthor small{
        font-size:10px;
        }
            
  



  /* Carousels ----------- */
  
  #carouselHolder{
    margin-top:47px; margin-bottom:47px;
    position:relative;
    }
    #carouselHolder span.badgeHolder{
      position:absolute; top:18px; left:18px;
    }
    span.tooltip {
      position:absolute; left:40px; top:20px; z-index:10;
      width:160px;
      padding:10px 5px;
      font-size:14px;
      background:#fff;
      }


/*
  Content Form
--------------------------- */  
ul.formList{
  padding-top:24px;
  }
  ul.formList li label{
    padding-left:10px;
    }
  ul.formList li input{
    padding-left:22px;
    margin-left:3px;
    }
  
  /* Custom Checkboxes ----------- */
  span.ui-radio {
    display: block; float: left;
    width: 16px; height: 16px;
    cursor: pointer;
    background:url(img/checkbox_orange.jpg) 0 0 no-repeat;
  }
  span.ui-helper-hidden,input.ui-helper-hidden-accessible  {
    display: none;
  }
  span.ui-radio-state-checked,
  span.ui-radio-state-checked-hover{
    background-position:0 -16px;
  }
      
  /* footer Links ----------- */  
  
  .bottomMeny ul li a{ font-size:12px; line-height:14px;}
  
  
  
  .footerLinks {
    margin:27px 0;
    }   
    .footerLinks ul li{
      float:left; display:inline; 
      padding:0 6px;
      border-right:1px solid #000;
    }
      .footerLinks ul li a{
        font-size:12px; line-height:14px;
        }
    .footerLinks p{
      font-size:10px; line-height:12px; padding-left:10px;
      }

    @media print {
      body {font-family: Georgia,"Times New Roman",Times,serif; background-color: #fff; width: 90%}
      .mainNavigation,
      #loginHolder,
      #rightColumn,
      .commentlink,
      #socialshareprivacy,
      #comments,
      .footerLinks,
      .container_12 .grid_4,
      .bottomMeny,
      .partner {display: none !important; margin: 0; padding: 0; height: 0px; width: 0px}
      
      .container_12 .grid_8 {width: auto}
      
      .articleTextInner p, .articleTextInnerText p {font-size: 16px !important}
      
      #header h1 a.logo {
        background: none;
        text-indent: 0;
        height: 20px
      }
      
      #header {height: 70px}
    }
    
    
    /* youtube videoplayer embed */
    iframe.video-embed-620 {
      width: 620px;
      height:350px;
    }


/* templates without images */
.level-3-noimage .infoText,
.level-7-noimage .infoText {
  float: none;
  width: 70%;
  height: auto;
}

.level-3-noimage .moreLink,
.level-7-noimage .moreLink {
  left: auto;
}