/*Media container viewport*/





.media-container.detailed {
    max-width: 1120px;
    height: auto;
    position: relative;
}
.page-home .image-bar .media-container.detailed {
    left: 275px;
    top: 0;
}

.media-container .video-close-button {
   position: absolute;
   top: 10px;
   right: 15px;
   display: none;
   z-index: 666;
   padding: 0 0 0 4px;
   font-size: 14px;
   font-weight: bold;
   background-image: url("../images/img_close.png");
   background-repeat: no-repeat;
}
@media (min-width: 1140px){
.media-container.is-thin.media-container-finance .viewport{
    max-height:279px !important;
} 
}
.media-container ul,
.media-container li {
   list-style: none outside none !important;
}
.media-container ul.items,
.media-container ul.items li {
   padding: 0px !important;
   margin: 0px !important;
}
.media-container .viewport {
   position: relative;
   max-height: 643px;
   width: 100%;
   overflow: visible;
   margin-bottom: 20px;
   min-height: 485px;
}
.media-container.is-thin .viewport {
   min-height: initial;
   max-height: none;
   height: 343px;
   overflow: hidden;
}
.profil .media-container .viewport {
   min-height: 320px;
   margin-bottom: 0;
}

.media-container .viewport.big-viewport {
   height: 643px;
}

.cities .media-container .viewport {
   border-color: #BE0000;
}
.award .media-container .viewport {
   border-color: #981CB7;
}
.news .media-container .viewport {
   border-color: #75A200;
}

.icon.icon-close {
   z-index: 100000 !important;
   width: 30px;
   height: 30px;
   background-position: center center;
}

.media-container .viewport .navigation {
   display: block;
   position: absolute;
   width: 50px;
   height: 100px;
   top: 50%;
   margin-top: -50px;
   z-index: 2;
   background-position: center center;
   background-repeat: no-repeat;
   visibility: hidden;
}

.media-container .viewport .prev {
   left: 15px;
   background-image: url('../images/img_slider-left.png');
}

.media-container .viewport .next {
   right: 15px;
   background-image: url('../images/img_slider-right.png');
}

.media-container .viewport:hover .prev,
.media-container .viewport:hover .next {
    visibility: visible;
}

.media-container .viewport .items {
   z-index: 1;
}

.media-container .viewport .items .item {
   display: block !important;
   position: absolute;
   top: 0px;
   left: 0px;
   height:100%;
   width:100%;
   max-width: 1120px;
   background-image: url("../images/img_gradient1.png");
}

.media-container.compressed .viewport .items .item {
   /*width: 870px;*/
}


.media-container img,
.media-container .viewport .items,
.media-container .viewport .items .item,
.media-container .viewport .items .item .video,
.media-container .viewport .items .item .video .__CbUiPlayer,
.media-container .viewport .items .item .video .__CbUiPlayer * {
    display: block !important;

    position:absolute !important;
    left:0;
    right:0;
    top:0;
    bottom:0;

    padding: 0px;
    margin: 0 auto;

    max-width:100% !important;
}

.media-container .viewport .items,
.media-container .viewport .items .item,
.media-container .viewport .items .item .video,
.media-container .viewport .items .item .video .__CbUiPlayer {
    height:100% !important;
}

.media-container .viewport .items .item img {
  width:100% !important;
}

.media-container .viewport .items .item .video .__CbUiPlayer .__CbUiImgButton.__CbUiPlayerPlayButton {
    height: 100px !important;
    width: 100px !important;
    left: 50% !important;
    top: 50% !important;
    margin-left:-50px;
    margin-top:-50px;
    -moz-box-shadow: none;
    -webkit-box-shadow: none;
    box-shadow: none;
}

.media-container .viewport .items .item:not(:first-child) {
   /*
    * This rule is not required for the media container to work, but it makes
    * everything look smoother. It is optional, and that is the reason why it
    * uses complex CSS3 selectors that are not supported by all browsers.
    */
   display: none;
}

.videothumbnail-play-icon {
    height: 70px;
    width: 70px;
    background-image: url(/player40/media/ag-dok/play_icon_slides.png);
    position: absolute;
    left: -10px;
    bottom: -10px;
    z-index: 10;
}

.media-container .thumbnails {
   position: relative;
   overflow: hidden;
   width: 544px;
   height: 104px;
}
.media-container .thumbnails ul {
   visibility: hidden;
   position: relative;
   top: 0px;
   left: 0px;
   height: 100px;

   /*
    * This makes sure that nothing wraps in the visible area. This is required
    * for the size calculations to work, since they cannot be done before
    * everything has loaded. Until then, this ensures that it appears correctly.
    */
   width: 900000000px;
}
.media-container .thumbnails ul li {
   position: relative;
   float: left;
   margin-left: 20px;
   cursor: pointer;
   border: 2px solid #2B759A;
}
.cities .media-container .thumbnails ul li {
    border-color: #be0000;
}
.award .media-container .thumbnails ul li {
    border-color: #981CB7;
}
.news .media-container .thumbnails ul li {
    border-color: #75A200;
}

.media-container .thumbnails ul li.first {
   margin-left: 0px;
}
.media-container .thumbnails ul li img {
   position: relative;
   z-index: 1;
}
.media-container .thumbnails ul li .frame {
   display: none;
   position: absolute;
   top: 0px;
   left: 0px;
   right: 0px;
   bottom: 0px;
   z-index: 2;
   -moz-box-shadow: 4px -4px 4px black inset, -4px 4px 4px black inset;
   -webkit-box-shadow: 4px -4px 4px black inset, -4px 4px 4px black inset;
   box-shadow: 4px -4px 4px black inset, -4px 4px 4px black inset;
}
.media-container .thumbnails ul li.active .frame {
   display: block;
}
.media-container .social-media {
   float: right;
}
.media-container .social-media a {
   display: block;
   float: left;
}

.media-container .show-trailer, .media-container .hide-trailer {
   float: right;
   line-height: 33px;
   padding: 0px 8px;
}

.media-container .hide-trailer {
   display: none;
}

.collapsible.only-videos {
   display: none;
}

.media-container .toggle-thumbnails {
   float: right;
   line-height: 33px;
   padding: 0px 8px;
}
.media-container .toggle-thumbnails .show-label,
.media-container .toggle-thumbnails.thumbnails-hidden .hide-label {
   display: none;
}
.media-container .toggle-thumbnails .hide-label,
.media-container .toggle-thumbnails.thumbnails-hidden .show-label {
   display: inline;
}

.media-container .viewport .prev,
.media-container .viewport .next {
   outline: none;
}
.media-container p.details {
   margin: 0px;
   width: 600px;
   padding: 3px 0;
}

.media-container.detailed .viewport .items .item .details {
   position: absolute;
   right: 0px;
   bottom: 50px;
   width: 400px;
   padding: 10px 40px 10px 10px;
   background-color: #FFFFFF;
}
.media-container.detailed .viewport .items .item .details h5 {
   font-size: 36px;
   line-height: 110%;
}
.media-container.detailed .viewport .items .item .details h6 {
   font-size: 16px;
   margin: 10px 0px 0px 0px;
}
.media-container.detailed .viewport .items .item .details .description,
.media-container.detailed .viewport .items .item .details .datetime,
.media-container.detailed .viewport .items .item .details .tickets,
.media-container.detailed .viewport .items .item .details .ticket-hotline {
   margin: 0px;
}

/* social plugins */
.media-container .social-plugins {
   float:right;
}
.media-container .social-plugins span.facebook_bt,
.media-container .social-plugins span.twitter_bt {
   display:block;
   float:right;
   margin:7px 0;
}

.media-container .media-window {
   float: right;
   line-height: 33px;
}

.media-container hr {
    color: #FFFFFF;
    margin: 0;
    text-align: left;
    width: 544px;
}

.video-watermark {
   background-color: #000000;
   top: 5px;
   right: 5px;
   text-decoration: none;
   color: #FFFFFF;
   font-family: arial,sans-serif;
   font-size: 12px;
   position: absolute;
   z-index: 1337;
   padding: 0 2px;
}


/* override margin from default.css */
.news ul li img {
    margin: 0;
}

.dashboard {
    background: none repeat scroll 0 0 #2f2a2c;
    bottom: 0;
    height: 98px;
    position: absolute;
    right: 0;
    width: 701px;
    z-index: 2;
}

@media only screen and (min-width: 960px) and (max-width: 1160px) {

   .media-container .viewport {
      min-height: 407px;
      max-height: 551px;
   }

   .media-container.is-thin .viewport {
      min-height: initial;
      max-height: none;
      height: 314px;
   }
   .media-container.is-thin.media-container-finance .viewport{
     height:234px ;
    }

   .media-container .viewport.big-viewport {
      height: 551px;
   }
   
   .profil .media-container .viewport {
      min-height: 268px;
   }

}

@media only screen and (min-width: 768px) and (max-width: 959px) {

   .media-container .viewport {
      min-height: 324px;
      max-height: 441px;
   }

   .media-container.is-thin .viewport {
      max-height: none;
      min-height: initial;
      height: 290px;
   }
    .media-container.is-thin.media-container-finance .viewport{
      height: 186px;
    }     

   .media-container .viewport.big-viewport {
      height: 441px;
   }
   
   .profil .media-container .viewport {
      min-height: 213px;
   }

}

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

   .media-container.is-thin .viewport,
   .media-container .viewport {
      min-height: 130px;
      max-height: 172px;
   }

   .media-container.is-thin.media-container-finance .viewport .items .item{
      height: 57% !important;
    } 
    .media-container.is-thin.media-container-finance.detailed{
        height:100px;
    }
    
   .media-container.is-thin .viewport {
      height: auto;
   }

   .media-container .viewport.big-viewport {
      height: 172px;
   }

}

@media only screen and (max-width: 767px) and (min-width: 480px) {

   .media-container.is-thin .viewport,
   .media-container .viewport {
      min-height: 182px;
      max-height: 241px;
   }

   .media-container .viewport.big-viewport {
      height: 241px;
   }

}