@charset "UTF-8";


/* Liquid CSS */

/*reset regular styles, for example only show some additonal elements in liquid version and hide from regular version*/

.liquidOnly {display: none;}

/* NC */
@media only screen and (min-width: 1150px) {
 #nc { width: 1130px; }

}

/* NC PAGING ARROWS */

/* screen browsers */
@media only screen and (max-width: 768px),
/* tablet browsers */
only screen and (min-device-width: 640px) and (max-device-width: 1024px) {

}

@media only screen and (max-width: 925px)
{

/* M I N I _ E P G */

/*when adjusting width of the miniepg for iPad, make sure that at least one element in the miniepg_stage ul is NOT masked */
/* otherwise miniepg slider will not work */

#footer .wrap { width: 98%; }

#footer .mini-epg .wrap { width: 490px; }

#footer .mini-epg #miniepg_stage { width: 426px; margin:0 32px; }

#footer .mini-epg .tv {margin-right:12px; width: 117px;}

#footer .mini-epg .open ul {width: 100px;}

}

/********** 768px ***************************/

/* ipad portrait mode, and screen liquid 768 */
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation : portrait), only screen and (max-width: 768px){

/*GENERAL*/

.wrapper { min-width:0; }

.size1of1, .lowerContent { width: 738px; }

.nc .newsContent.size1of1 { width: 98%; margin: 0;}

article, .iframe, .iframe iframe { width: 100% /* !important wont work with the view-flex, view-fix setup*/; }

#iframeHome, #iframeHome iframe { width: 738px; }

.detail section.size6of8 {width: 708px; }

.boxFull { width: 95%;}

table.wide { width: 708px; }

/* aside {width: 704px;} */

/*HIDE*/

footer .searchForm, .timeCarousel, #header .nav ul li.sendungenaz, .main aside, .footer-nav ul li, .zdfsportGalFullscreen { display: none; }

/*SHOW*/

.liquidOnly,

.footer-nav ul li.liquidShow{ display: block; }

/*HEADER*/

#header { min-width: 0; }
#header .nav { padding:8px 0px; }
#header .nav > ul.logonav > li { display: none; }
#header .nav > ul.logonav > li.logo { display: block; }
#header .sendernav { display: block; }
#header .sendernav ul { display: none; }

#content header .titleheader { margin-left:0;}

/*RUBRIKEN, WEITERE THEMEN*/

.rubriken #dd-popup .rubriken-menu { width: 742px; }

.rubriken #dd-popup .rubriken-menu > ul > li { width: 237px; }

.rubriken-menu ul li { width: 226px; margin: 0 15px 5px 0; }

.jcarousel-skin-weitere-themen .jcarousel-clip { margin:0 50px; }

/*ASIDE*/

.themebox { background-color: #fff; }

aside .box h5 {width: 440px;}

aside .arr, aside a:hover .arr, aside .arr, aside a:focus .arr {

    background-position: left 46%;

    margin: 0px;

    line-height: 24px;

}

/*MEDIA BÜHNE*/

.boxDetail h2 {margin-bottom: 10px;}

/* #boxTabbed div img, #boxTabbed div object { width: 100%; } */

menu li {width: 155px;}

/*IMG GALLERY */

.galleryInterface { width: 674px !important;}

/*LIGHTBOX*/

.lbContent{ width: 740px; }

.lbContent img { width: 740px; overflow: hidden;}

/* OTHER */

#content article.bBox .bBoxContent .content{
float: left;
width:405px;
}

#content #eil { width: 708px;}

#eil h3, article .desc {margin-bottom: 4px;}

/* .ersatzFlash .ui-accordion-content img {width:676px;} */

.beitrag .simpleContent, .beitrag .box p, .beitrag .boxTeaser p { padding-right: 10px;}

.beitrag .ui-accordion-content p {padding-right: 30px;} /*new*/

/*SUCHSEITE*/

.teaserbox .desc { width: 480px; }

/*THEMENSEITE*/

.lowerContent .imagebox {width: 100%;}

.boxDetail .paging { top: -30px !important;}

.lowerContentBox .paging { margin-top: -6px; }

/*FOOTER*/

#footer {width:100%; margin:0 auto; }

footer nav .listInline li{ margin-right: 10px; }

#foo_dark { background-repeat: repeat; height: 40px; max-width: 100%; min-width: 100%; }
.footer-nav ul.loner { float:left; }
.footer-nav ul.loner li { margin: 0 12px 0 0; }
#foo_light { min-width: 100%; }

/* MINI_EPG*/

/*when adjusting width of the miniepg for iPad, make sure that at least one element in the miniepg_stage ul is NOT masked */

/* otherwise miniepg slider will not work */

#footer .wrap { width: 98%; }

#footer .mini-epg .wrap { width:490px; }

#footer .mini-epg #miniepg_stage { width: 426px; margin:0 32px; }

#footer .mini-epg .tv {margin-right:12px; width: 117px;}

#footer .mini-epg .open ul {width: 100px;}

/*NC*/

#nc .newsContent .newsText p { width: 98%; }

#nc .newsContent .newsText { float: none; }

/*VIDEOLEISTE*/
#content #mainStage article.size1of1 {
 float: none;
 width: 100%;

height: auto;
}

#content #mainStage #highlight {
 position: relative;
 z-index: 0;
 height: auto;
 width: auto;
 right: auto;
 box-shadow: none;
 padding: 0;
}

#content #mainStage #highlight .videoleiste { 
 float: left; 
 width: 50%; 
 margin-bottom: 5px;
}

#content #mainStage #highlight .videoleiste h3,
#content #mainStage #highlight .videoleiste ul {
 margin-left: 16px;
} 

#highlight .weather h3 {
 margin: 25px 17px 20px 0px;
}

#highlight .dividerHorizontal {
display:none;
}
#highlight .dividerVertical {
display:block;
 border-left: 1px solid #D5DBDF;
 border-top: 0;
 height: 300px;
 width: 1px;
 position: relative;
 top: 30px;
 left:auto;
 float: left;
 margin-right: 25px;
}
#content #mainStage #highlight .weather { float: left; }
#content #mainStage #highlight .mainzel { width: 130px; }

#content #mainStage article .itemContent {
 height: auto;
}

#content article .itemContent .teaser-link {
 height: auto;
 position: relative;
 left: auto;
 bottom: auto;
}

#content article .itemContent .teaser-link div {
 padding-left: 0;
}

#content .teaserItem {
 height: auto;
}

#content .teaserItem .itemImage {
 position: relative;
 width: 100%;
 height: auto;
 overflow: hidden;
 text-align: left;
}

#content .teaserItem .itemImage > div {
 display: inline-block;
}
#content .teaserItem .itemImage img {
 position: relative;
 width: 100%;
}

#content #mainStage article nav.link-list { position: relative; top: 0; }

#content #mainStage article .itemContent .teaser-link { top: 0; }

#content .teaserItem .itemVideo {
 position: relative;
 width: 100%;
 background-color: #000;
 text-align: center;
}
#content .teaserItem .itemVideo > div {
 display: inline-block;
}
#content .teaserItem .itemContent {
 position: relative;
 width: auto;
 height: auto;
 float: none;
}

#content .teaserItem .link-list {
 width: 100%;
 position: relative;
 left: auto;
 bottom: auto;
}

.link-list,
.link-list .item,
.link-list .item a {
 height: 65px;
}

/* Blogteaser = Gestalteter Teaser*/

#content a.teaserDesign h2 { font-size: 18px; line-height: 20px; }
#content a.teaserDesign .teaserDesignContent { padding-top: 18px; padding-left: 20px; }

}/***********END 768*********/

/************ 640px **************/

/* @media only screen and (max-device-width: 640px),  only screen and (max-width: 640px){ */

/* @media only screen and (min-device-width: 640px) and (max-device-width: 800px) and (orientation : portrait), only screen and (max-width: 640px){ */

@media only screen and (device-width: 640px) and (orientation : portrait), only screen and (max-width: 640px){

/*GENERAL, GRID, LAYOUT*/

.size1of1, .lowerContent { width: 614px;}

#main .size6of8 { width: 95%; }

.detail section.size6of8 {width: 584px; }

.boxFull { width: 95%; }

table.wide { width: 584px; }

.iframe, .iframe iframe { width: 614px !important; }

#iframeHome, #iframeHome iframe { width: 614px; }

/*HIDE*/

.teaserbox .teaserimg img, .zdfsportGalFullscreen  { display: none !important; }

/*NEWS TEASER*/

#mainStage,
#content article { width: 100%; }

#content .itemImage,
#content .itemVideo { background-size: auto; width: 280px; }

/* MainStage */
#highlight .dividerVertical {
 margin-right: 2%;
}

#highlight .weather h3 {
 margin: 25px 17px 20px 0px;
}
.weather .dd {
 width: 160px;
}
.weather .customScroller {
 width: 170px;
}
.weather ul {
 width: 160px;
}

/*RESET HEADER from 768 version */
#header .nav ul.loner { width: auto; }
#header .nav ul.loner .searchForm { margin-top: 0px; }

/*RUBRIKEN, WEITERE THEMEN*/

.rubriken #dd-popup .rubriken-menu { width: 580px; margin:10px auto; }

.rubriken #dd-popup .rubriken-menu > ul > li { width: 280px; }

.rubriken-menu ul { width: 599px;}

.rubriken-menu ul li { width: 284px; margin: 0 15px 5px 0 !important; } /*important will overwrite the 'last' style*/

.jcarousel-skin-weitere-themen .jcarousel-clip { margin:0; }

/*MEDIA BÜHNE*/

#boxTabbed { height: auto; position: relative; width: 100%;}

#boxTabbed div img,

#boxTabbed div object { width: 100%; height: auto; }

#boxTabbed .tabContent { width: auto; }

#boxTabbed .info p { padding-right: 0; }

#boxTabbed .videoPreview,

#boxTabbed .player { width: 100% !important; height: 329px !important; }

/*IMG GALLERY */

.galleryInterface { width: 584px !important; height: 328px;}

/*LIGHTOX*/

.lbContent{ width: 614px; }

.lbContent img { width: 614px; overflow: hidden;}

/*SUCHSEITE*/

.filter li {white-space: nowrap;}

.filter li a {line-height: 25px;}

.filter.small-margin li { width: 185px; display: inline-block; }

.filter.small-margin li input { margin-bottom: 15px;}

.lowerContent .airdate .dateimg { width: 460px; }

.teaserbox .desc { width: 100%; }

/*OTHER*/

#content #eil { width: 584px;}

.ersatzFlash .ui-accordion-content img {width:100%;}

.ersatzFlash .ui-accordion-content p {padding-right: 0px;} /*new*/

#sm .sm a {margin-left: 15px;}

#content article.bBox .bBoxContent .content{
float: left;
width:280px;
}

/*FOOTER*/

#footer {width: 100%; margin:0 auto; }

footer nav .listInline li{ margin-right: 5px; }

/* MINI_EPG*/

/*when adjusting width of the miniepg for iPad, make sure that at least one element in the miniepg_stage ul is NOT masked */

/* otherwise miniepg slider will not work */

#footer .wrap { width: 96%; }

#footer .mini-epg .wrap { width:600px; margin-top: 15px; }

#footer .mini-epg #miniepg_stage { width: 495px; margin:0 50px;}

#footer .mini-epg .tv {margin-right:15px;}

/* TEST */
#content a.teaserDesign .teaserDesignContent { padding-top: 10px; padding-left: 10px; }
#content a.teaserDesign p { padding: 6px 0px 6px 0; }

/* NC */
.nc .newsContent .message { margin-left: 190px; }
}/***********END 640*********/

@media only screen and (device-width: 600px) and (orientation : portrait), only screen and (max-width: 600px){
#highlight .dividerVertical,#highlight .dividerHorizontal { 
 display: none;
}
#content #mainStage #highlight .videoleiste { 
 float: none; 
 width: 100%; 
}
#content #mainStage #highlight .weather { 
 float: none;
 width: 100%;
 padding: 16px;
}

}

