/* focus class for all elements, this is debug
 * @todo write :focus rules for the element that lack it

 binary out comment block * /
*:focus{

    background: yellow !important;
    opacity: 0.5 !important; -moz-opacity: 0.5 !important; filter:alpha(opacity=50) !important;

}
/* */

/* sitebg, this is where the background of the page is defined */
/** /
body{ background: #e8e8e8; }
#top{ background: url('g/sitebg/top.gif') no-repeat top center; }
/* /
#top{ background: url('g/sitebg/bg-dans.jpg') no-repeat top center; }
body{ background: #eaeaea; }
/* */

body {
    background: #E8E8E8;
    font-size: 12px; line-height: 16px;
    font-family: arial, sans-serif;
}

a { text-decoration: none; }

h1, h2, h3, h4, h5, h6 {
    font-family: arial, sans-serif;
}


.news-story div {
    float: left;
}

#wrapper-page{
    overflow: hidden; clear: both;
    background: url('g/sitebg/bg.gif') repeat-y bottom center;
    padding-bottom: 10px;
}

/* Mmm... brush-up link styling: */
#wrapper-page a {
    color: #004276;
}

#wrapper-page a:hover {
    color: #0076D3;
    text-decoration: underline;
}

#wrapper-page a:visited {
    color: #551A8B;
}

#deck-1,
#fpbreaking,
#content-current,
#content-latest {
    margin-top: 5px;
}

#wrapper-page .breaking-bar.standard.dark-text a {
    color: #000;
}

#wrapper-page .breaking-bar.standard.dark-text a:hover {
    color: #2F2F2F;
}


/* =========================================================================
 * = Hover and focus states for clickable elements                         =
 * ========================================================================= */

/* All the black text, that should become grayish; first hover, then the same
 * rules again, but this time for keyboard focus */
.teaser-top a.dark:hover,
a:hover, .title a:hover, .widget-itemlist a:hover, #nav-siteindex a:hover,
.content-partners a:hover, ul.popular li a:hover,
#content-tvtid .recommendations li a:hover, #content-current #content-tv h2 a:hover,

.teaser-top a.dark:focus,
.title a:focus, a:focus, .widget-itemlist a:focus, #nav-siteindex a:focus,
.content-partners a:focus, ul.popular li a:focus,
#content-tvtid .recommendations li a:focus, #content-current #content-tv h2 a:focus
{ color: #555; }

/* the red text, that should become a bit brighter on mouse over */
a.vignette:hover, .nav-context a:hover, .content-partners .vignette a:hover,
a.vignette:focus, .nav-context a:focus, .content-partners .vignette a:focus
{ color: #e63333; }

/* the tab in the most popular box */
ul.popular a.tab:hover,ul.popular a.tab:focus{ color: #b30000; }

/* breaking news bar */
a.breaking:hover, a.breaking:focus{ color: #5a5537;}



/****************** end of hover and focus states for clickable elements **/


/* commercial code specific for this site */
#commercials{
    /* This is a place holder for the commercial preloader, hidden */
    position:absolute; height: 0; width:0; left: -9999px; bottom: 0;
}

.com-megaboard-outside {
    position: relative; z-index: 10000;
	height: 185px;
    line-height: 0; /* removes whitespace after the element */
}

    .com-megaboard-top {
        position: relative;
        width: 999px; min-height: 180px;
        margin: 0 auto;
    }

    .com-vinkeltop {
        position: relative;
    }

        body .com-megaboard-top .stand-alone {
            background: url('g/annonce999x190.gif') repeat-x 1px 0px;
			padding-bottom: 10px;
            text-align: center;
        }

        body .com-megaboard-top .hockey-stick {
            display: block;
            position: relative; top: 0;
            margin: 0; padding: 0;
            background: url('g/hockeyannonce.gif') no-repeat 1px 0px;
        }

            body .com-megaboard-top .hockey-stick div {
                /* overwrite custom widths on divs printet by the ad network */
                width: 999px !important;
            }

            body .com-megaboard-top .hockey-stick img,
            body .com-megaboard-top .hockey-stick embed,
            body .com-megaboard-top .hockey-stick object {
                position: relative;
                width: 999px; left: 1px;
            }

        body .com-megaboard-top .double-hockey-stick {
            display: block; width: 999px;
            padding-bottom: 10px;
            background: url('g/annonce.gif') no-repeat bottom center;
        }


    .com-vinkelsky .com-vinkelsky {
        position: absolute; top: 0; right: 0;
        margin: 0; padding: 0;
    }

        .com-vinkelsky-left .com-vinkelsky-left {
            display: block; width: 130px;
            position: absolute; top: 0;
            margin-left: -130px; left: 0;
            text-align: right;
        }

    /* rectangle banner */
    div.com-downtown,
    div.com-midt-banner {
        float: left; width: 311px;
        /*overflow: hidden;*/

        border: 1px solid #DBDBDB;
        margin-right: 10px; margin-top: 30px;
        padding: 10px 1px 4px 1px;

        background: transparent url('g/annonce.gif') no-repeat right top;

        text-align: center;
    }

    /* 930x600 banner */
    .tv2-widget.banner.megabanner > .body {
        background: transparent url('g/annonce.gif') no-repeat top right;
    }

    div.com-downtown {
        margin-top: 0;
    }

    /* 630x130 banner */
    div.com-small-wide {
        float: left; width: 647px;
        overflow: hidden;

        border: 1px solid #DBDBDB;
        margin-right: 10px; margin-top: 30px;
        padding: 10px 8px 7px;

        background: transparent url('g/annonce.gif') no-repeat right top;

        width: 630px;
        height: 130px;
    }

    div.com-small-wide-bilzonen {
    float: left; width: 647px;
        overflow: hidden;

        border: 1px solid #DBDBDB;
        margin-right: 10px; margin-top: 30px;
        padding: 10px 8px 7px;

        background: transparent url('g/annonce.gif') no-repeat right top;

        width: 630px;

    }

    span.provided-by {
        float: right;
        margin-right: 15px;
        text-transform: uppercase;
        font-size: 8px;
        color: #dbdbdb;
    }

    div.com-small-wide-bilzonen img {
        margin-left: 9px;
    }

    /* 930x600 banner */
    .com-megaboard-forside-wide {
        overflow: hidden;

        border: 1px solid #DBDBDB;
        margin-left: 10px;
        margin-right: 10px;
        padding: 10px 13px 10px 14px;


        background: transparent url('g/annonce.gif') no-repeat right top;

        width: 930px; /* 979 - 2 - 47*/
        height: 600px;
    }

/**=TV TID ---------------------------------------------------------------*/
#content-tvtid .vignette {
    width: 315px; height: 25px;
    background: white url(/img/video/videotop.gif) no-repeat left top;
}

#content-tvtid .video-player-bottom {
    height: 26px;
    border-top: 1px solid white;
    background: white url(/img/video/videobund.gif) no-repeat left top;
}

#content-tvtid .video-player-bottom a {
    float: right;

    padding-right: 5px;
    padding-top: 5px;
    padding-left: 7px;

    background: transparent url(/img/video/linkpilsort.gif) no-repeat scroll 0 10px;

    color: black; font-weight: bold;
}

#commercial-tvtid {
    margin-right: 0px;
}

.com-tvtid {
    width: 348px;
    margin-top: 10px;
    background: #fff;
}

#commercial-tvtid { background-color: #fff; }

#content-transition-message{
    text-align: right; padding: 4px 0;
}
#content-transition-message li{ display: inline; padding-left: 1em;}
#content-transition-message li a{
    background: url('g/icons/listBullet.gif') no-repeat left center;
    color: #000;
    padding-left: 8px;
}
    #content-transition-message li a:hover,
    #content-transition-message li a:focus{ color: #555; }


#content-current{ float: left; }

    p{ font-size: 12px; line-height: 16px; }

    #content-news .title {
        font-size:14px !important; /* no! */
        font-weight: bold;
        padding-top: 2px;
    }



    #content-current .content-news{ padding-bottom: 16px; }
    #content-current .content-news h2, #oversigt h2{
        position: absolute;
        text-indent: -9999px; height: 0;
    }
        #content-current .col-2 .title{
            font-size: 14px;
        }
        #content-current .col-2 .summary{
            /* Hide the news summary for news stories that spans two colums in
             * the grid visual user agents -- It's a design decision.  */
            text-indent: -9999px; line-height: 0; margin: 0 0 16px 0;
            padding: 0;
            position: absolute; left: -9999px;
        }
        #content-latest ol{
            padding: 0;
        }


    #content-weather{
        float: left; clear: left;
    }

    #content-statistics{
        float: right;
        clear: right; /* needs to clear right, for firefox 2 */
        /** / position: relative; /**/
    }

    #content-tvtid{
        float: left; width: 315px;
        background: #dcdcdc url('g/videoguide/bg.gif') no-repeat;
    }

        #content-tvtid .nav-context{
            clear: both;
        }

    #content-tv-heading a{
        color: #000;
        font-size: 14px;
    }

    #content-latest {
        float: left;
    }
        #content-latest .widget-itemlist{
            border: 1px solid #a5a5a5;
            width: 313px;
        }
        #content-latest .widget-itemlist h2{
            padding-left: 3px;
        }


    .nav-context h3, .nav-context h4{
        height: 0; overflow: hidden; clear: both;
        position: absolute; left: -9999px; bottom: 0;

    }

    /* breaking */
    .teaser-top{
        float: left;
        overflow: hidden;
        /* width: 999px; /* ie7 fix; the box expanded into the gutter otherwise */
        text-align: center;
    }

        .teaser-top h2{ text-align: left; }

        .teaser-top a{ color: #000; }
        .teaser-top .update{ text-indent: 0; height: auto; }

        .teaser-top a.breaking{
            background: #eecd18 url('g/breaking/bg.gif') repeat-x;
        }

        .teaser-top a.light{ color: #f0f0f0; }
            .teaser-top a.light:hover,.teaser-top a.light:focus{ color: #fff; }
        .teaser-top a.dark{ color: #000; }
            .teaser-top a.dark:hover,.teaser-top a.dark:focus{ color: #555; }

    /* vejrtrafik */
    .vejrtrafik-top {
        background: #dcdcdc url('g/ticker/vejr_trafik.gif') no-repeat left;
        padding-left: 110px;
        width: 870px;
    }
    .vejrtrafik-top h2 {
        height: 22px;
    }

    /* Popular tab box */
    .popular li a.tab {
        height: 23px; width: 78px;
        position: absolute; top: 1px;

        text-align: center;
        font-size: 11px; font-weight: bold;
    }

        /* move the tabs to the right positions */
        .popular li.nyheder .tab{ left: 0; }
        .popular li.sporten .tab{ left: 79px; }
        .popular li.gossip  .tab{ left: 158px; }
        .popular li.video   .tab{ left: 237px; }

    .popular li.current{
        padding-top: 23px;
        width: 315px; overflow: hidden;
        min-height: 130px; _height: 130px;
    }

    .popular li a.tab {
        background: url('g/statistics/tab.gif') no-repeat;
        background-position: 100% 0;
        color: #555; padding-top: 3px;
    }
    .popular li.current .tab{ background-position: 0 0; color: #990000; }
    .popular li.current{
        background: url('g/statistics/bg.gif') repeat-x 0 21px;
    }
    .popular ol li{
        padding: 1px 5px 2px 5px;
    }
    .popular ol a{
        color: #000;
    }


    /* Related news in news teasers */
    .news-story .news-related{
        /* for now we just hide the related news for all users, we might want to
         * make this data available for non-visual user-agents */
        display: none;
    }

    .news-story .news-related a{
        color: #000;
        background: url('g/icons/listBullet.gif') no-repeat left center;
        padding-left: 8px;
        font-size: 12px; line-height: 16px;
    }
        .news-story .news-related a:hover,
        .news-story .news-related a:focus{
            color: #999;
        }


    /* content-tv */
    /*  ---------------------------------------------------- */
    .content-programguide.col-4 {
        margin-bottom: 15px;
        background-color: #262425;
        border-radius: 5px;
    }
    
    #content-tv {
        position: relative;
        float: left;
        margin-bottom: 20px; padding-top: 16px;
        border-bottom: 1px dotted #ccc;
    }

    #content-tv .news-story .meta .vignette { margin-top: -3px; }

    #content-current #content-tv h2{
        height: 16px; text-indent: 0;
        position: static;
        padding-bottom: 4px;
    }
        #content-current #content-tv h2 a{
            font-size: 16px; font-weight: bold; color: #000;
        }
    #content-current #content-tv .news-story .col-4{ padding-bottom: 0; }

    /* */
    #content-video h2{ font-size: 18px; font-weight: bold; padding-bottom: 5px;}

    #content-tvtid-onair{
        position:relative; bottom:4px;
        margin-top: 30px;
    }


    /* The program guide at the bottom of the page */
    #content-program-oversigt{
        position: relative;
        padding-bottom: 16px;
    }
    #content-program-oversigt h2 a{
        display: block;
        height: 49px; width: 138px;
        background: url('g/epo/tvtid.gif') no-repeat;
        text-indent: -9999px;
        padding: 0 0 5px 0; margin-top: 5px;
    }

    #content-program-oversigt .nav-context{
        position: absolute; top: 24px; right: 9px;
        clear: left;
    }
        #content-program-oversigt .nav-context a{
            display: block; float: left;
            padding: 0 8px 0 8px; margin-left: 12px;
            background: url('g/icons/listBullet.gif') no-repeat left center;
        }


.nav-context a{ font-weight: bold; }
.nav-context{ padding-top: 5px; }

.content-programguide > .nav-context {
    text-align: right;
    width: 296px;
    padding-top: 35px;
}

.content-programguide .tvtidlogo {
    background: url('g/tvtidlogo.png') no-repeat;
    width: 80px;
    height: 50px;
    position: absolute;
    left: 15px; top: 10px;
}

.content-programguide .watchall {
    color: #fff !important;
    position: absolute;
    right: 10px;
    top: 10px;
    background-color: #E87606;
    border-radius: 3px;
    padding: 2px 5px 2px 5px;
}

.content-programguide a.watchall {
    text-decoration: none !important;
}


/**************************************************************************
 *
 **************************************************************************/
.widget-itemlist{
    position:relative;
}

    .widget-itemlist .col-4{
        padding: 0 0 16px 0;
    }
    .widget-itemlist .latest{
        position: relative; float: left; width: 100%;
    }

    .widget-itemlist .nav-context h3, .widget-itemlist .nav-context h4,
    .widget-itemlist .topitem h4{
        /* hiding section headlines for visual agents; add further headlines
         * here if needed be */
        height: 0; overflow: hidden; clear: both; position: absolute;
        border: 0;
     }

    .widget-itemlist .subscribe{
        position: absolute; top: 4px; right: 0;
    }
        .widget-itemlist li.subscribe a{
            display: block;
            text-indent: -9999px;
            width: 37px; height: 12px;
            background: url('g/icons/rss.gif') no-repeat;
        }

    .widget-itemlist h2{
        font-size: 14px; font-weight: bold;
        border-bottom: 1px solid #ccc;
        padding: 1px 0;
    }

    .widget-itemlist h3{
        font-size: 18px; font-weight: bold;
    }
    #wrapper-page .widget-itemlist h3 a{ color: #000; }

    .widget-itemlist h4{
        /* todo, try fooling around with the letter-spacing */
        font-weight: 570; font-size: 14px;
        border-bottom: 1px solid #ccc;
        padding-bottom: 2px;
    }

    .widget-itemlist .topitem{
        _height: 198px; min-height: 198px; /* hack: makes min-height work in ie */
    }

    .widget-itemlist ol li{ border-bottom: 1px dotted #ccc; }

    .widget-itemlist ol a{
        color: #000;
        line-height: 16px;
    }

    .widget-itemlist ol span{
        /* Align the timestamp */
        display: block; float:left; width: 3em;
        color: #555; border-right: 1px solid #ccc;
        font-size: 10px; line-height: 12px; margin: 2px 4px;
    }
    .widget-itemlist ol a.source{
        display: block;
        font-size: 10px; line-height: 12px;
        float: right;
    }

    .widget-itemlist .nav-context { padding: 3px 0;}
    .widget-itemlist .nav-context ul li { display: inline; }

    .widget-itemlist .nav-context a {
        padding-left: 8px; margin-left: 9px;
        background: url('g/icons/listBullet.gif') no-repeat left center;
    }


/**************************************************************************
 *
 **************************************************************************/

    #content-tvtid-onair h3{
        /* hiding vignettes for graphical user agents
         * todo, collect all these and excecute them all in one go */
        height: 0; overflow: hidden; clear: both; position: absolute; border: 0;
    }

#content-video { float: left; }
#content-video .video-type-large{
    float: left; background: url('g/video/boxbg.gif') repeat-x top left; overflow: hidden;
    padding-bottom: 8px;
}

#content-video .video-description .title{ font-size: 18px; }

#content-video .video-description p,#content-video .video-description .title{
    padding: 8px 9px 0 9px;
}
    #content-video .video-description img,
    #content-video .video-description a{ display: none; }


/***************************************************************************
* Channel event status progress bar
*
* N.B. so far only col-4 is supported
***************************************************************************/
.col-4 .progress { float: left; position: relative; }
.col-4 .progress .channels{
    position: relative;
    background: #fff;
    border: 5px solid #545153;
}   
    .content-programguide .progress li a.location{
        background: url('g/sprites/tvtidlogos.png') no-repeat;
    }
    .content-programguide .progress li.channel-tv2 a.location{
        background-position: center 10px;
    }
    .content-programguide .progress li.channel-zulu a.location{
        background-position: center -25px;
    }
    .content-programguide .progress li.channel-charlie a.location{
        background-position: center -65px;
    }
    .content-programguide .progress li.channel-film a.location{
        background-position: center -105px;
    }
    .content-programguide .progress li.channel-news a.location{
        background-position: center -145px;
    }
    
    .content-programguide .progress li.channel-tv2 a.location,
    .content-programguide .progress li.channel-zulu a.location,
    .content-programguide .progress li.channel-charlie a.location,
    .content-programguide .progress li.channel-film a.location,
    .content-programguide .progress li.channel-news a.location {        
        padding-top: 10px;
    }


.content-programguide .progress li.channel-tv2 {
    border-top: 1px solid #000;
}

.content-programguide .progress li ol {
    border-right: 1px solid #000;
}

.col-4 .progress {
    border: 5px solid #262425;
}

.col-4 .progress .venue{
    float:left; clear:left;
    width: 296px;
    background-image: -webkit-gradient(linear, left top, left bottom, from(#E8E8E8), to(#ffffff)); 
    background-image: -webkit-linear-gradient(top, #E8E8E8, #ffffff); 
    background-image:    -moz-linear-gradient(top, #E8E8E8, #ffffff); 
    background-image:     -ms-linear-gradient(top, #E8E8E8, #ffffff); 
    background-image:      -o-linear-gradient(top, #E8E8E8, #ffffff); 
    background-image:         linear-gradient(top, #E8E8E8, #ffffff);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#E8E8E8', EndColorStr='#ffffff');
    border-bottom: 1px solid #000;
}

/* link to the venue/station */
.col-4 .progress a.location{
    display: block; float:left; clear: none;
    position: relative; top: 0; left: 0;
    text-indent: -9999px;
    height: 29px; width: 92px; margin-right: 0;
    border: 0;
    background-repeat: no-repeat; background-position: 0 0;
}

    /* stations */

.col-4 .progress .programme{
    float:left;
}

.col-4 .progress .programme li{
    display: none;
}

.col-4 .progress .programme li.current{
    display: block;
    min-height: 29px;
    height: auto; text-indent: 0;
    overflow: hidden;
    width: 202px;
    border-left: 1px solid #000;
    box-shadow: inset 5px 0px 5px -2px #888;
}

.col-4 .progress .programme:hover {
    box-shadow: 0px 0px 1px 2px #FF9900;
    z-index: 999; 
}

.col-4 .progress .programme .current a{
    text-indent: 0; border: none; background: none;
    display: block; width: 245px;
}


/* event title */
.col-4 .progress .programme li a{
    padding: 0;
    color: #000 !important;
    text-decoration: none !important;
}



/**************************************************************************
 *
 **************************************************************************/
.content-programguide .epo{
    /* make the content overflow */
    position: relative; overflow: hidden;
}

    .content-programguide .epo a{
        display: block; overflow: hidden;
        /* * / height: 2.5em; /* */
        white-space: nowrap;
    }

    /* the station */
    .content-programguide .channels{
        float: left;
        border-top: 1px solid #a6a6a6;
    }

    .content-programguide .venue{
        position: relative; float:left; clear: both;
        background-position: center left; background-repeat: no-repeat;
        border-bottom: 1px solid #efefef;
        width: 10000px;
        box-shadow: inset -7px 0px 5px -2px #888;
    }
        .content-programguide a.location{
            display: block; float:left; clear: none;
            position: relative; top: 0; left: 0;
            height: 30px; width: 82px; margin-right: 0;
            background-repeat: no-repeat; background-position: 11px 5px;
            text-indent: -9999px;
        }

    /* the stations programe */
    .content-programguide ol{
        display: block;
        float: left; clear: right;
        position: relative; top: 0;
    }

    .content-programguide .epo .venue{
        /* the gray stroke between the channels */
        border-bottom: 1px solid #a6a6a6;
    }
        .content-programguide .epo .programme{
            width: 9000px;
            /* off air */
            background: url('g/epo/offair.gif');
        }

        .content-programguide ol li{
            clear: none; float: left;
            border-left: 1px solid #a6a6a6;
        }

        .content-programguide ol li.offair{
            text-indent: -9999px;
            line-height: 34px;
        }

        .content-programguide ol li a{
            float: left; display: block;
            padding: 3px 0;
            font-size: 10px; font-weight: normal; color: #000;
            overflow: hidden;
            background: url('g/epo/airtime.gif');
            position: relative;
        }
            .content-programguide .epo a:hover,
            .content-programguide .epo a:focus{
                background-image: url('g/epo/selection.gif');
            }

        .content-programguide ol li .summary{
            display: block; clear: right;
            font-size: 12px; 
            padding-left: 6px;
            padding-top: 5px;
            position: relative;
            height: 36px;
            width: 300px;
        }
        
        .content-programguide ol li .broadtime{
            position: absolute;
            top: 20px; left: 2px;
        }

        .content-programguide ol li .dtstart{
            padding-left: 4px;
        }


/**************************************************************************
 * Video player
 **************************************************************************/
#content-video .video{
     position: relative;
}

#content-video .video-player{
    position: relative;
    /* */ background: none; /*/ background: #111; /* */
    display: block;
    height: 364px;
    position: relative;
}
    #content-video .video-player img{
        position: absolute; top: 0; left: 0;
        cursor: pointer;

    }

    #content-video .video-player .video-play-button{
        width: 100%; height: 100%;
        background: url('g/video/play.png') center center;
        z-index: 2; position: absolute; cursor: pointer;
    }

#content-video ul.video-playlists{
    background: #e8e8e8 url('g/video/border-col-4.gif') repeat-y;
    border-bottom: 1px solid #a8a8a8; border-top: 1px solid #a8a8a8;
}

#content-video ul .title{
    background: url('g/video/menu.gif');
    cursor: pointer;

    float:left; width: 100%;

    font-size: 14px; font-weight: bold;
    text-align: center;
    color: #000;
    background-position: 0 0;

    padding: 4px 0;
}
    #content-video ul .title:hover{
        background-position: -315px 0;
        color: #555;
    }

    #content-video ul .current .title{
        background-position: -630px 0;
        color: #f5f5f5;
    }

    #content-video ul .description{ display: none; }

    /* the sub current elements */
    #content-video li ol .title,
    #content-video li ol li.current .title,
    #content-video li.current ol .title {
        background: none;
        text-align: left;
        color: #000;
        width:205px;
        margin-top:0px;
        font-size: 12px;
    }

#content-video ul li{ clear: both; overflow: hidden; float: left; width: 100%; }

    #content-video ul li ol{
        display: block; float:left;

        height: 0; overflow: hidden;
        margin: 0; padding: 0;
        position: absolute;
    }
#content-video ul li.current ol {
    height: auto; width: 100%; overflow: auto;
    position: static;
    border-bottom: 1px solid #a1a1a1;
}

#content-video li.current li,

    #content-video li.current li:hover,
    #content-video li.current li:focus,
    #content-video li.current li.current {
        background-position: -315px 0;
    }

#content-video ul{ }

#content-video ol li{
    display: block; position: relative; float: left; clear: both;
    border-top: 1px solid #a1a1a1;
    _height: 61px; min-height: 61px; /* hack: makes min-height work in ie */
}

    #content-video .current ol li{
        _height: 61px; min-height: 61px; /* hack: makes min-height work in ie */
    }

    #content-video ol img{
        position: absolute; top: 5px; left: 5px;
        width: 90px; height: 51px;
    }

    #content-video ol .title{
        font-weight: bold; font-size: 12px;
        width: 205px; padding-left: 105px;
    }

    #content-video ol p{
        float: left; width: 205px; padding-left: 105px;
    }

    #content-video ol a{
        /* Link overlay; the link text is hidden and the link is put on top of
         * the '#content-video ol li'-element */
        position: absolute; top: 0; left: 0;
        display: block; _height: 61px; min-height: 61px; width: 315px;

        /* ie6 fix; this fill the overlay with the link */
        line-height: 1337px;

        /* hiding the link text for visual user agents */
        text-indent: -9999px;

        /* setting a solid background colour (any colour really), and putting
         * the opacity to full transparent, causes internet explorer based
         * browsers to put our link overlay over the element.
         *
         * Without this fix, the inline elements will, for some reason, stay
         * over the link overlay - catching all clicks! */
        background:#000;
        opacity: 0; -moz-opacity: 0; filter:alpha(opacity=0);
    }


/**************************************************************************
 * Image galleries
 **************************************************************************/
.content-image-galleries h2{
    display: block;
    font-size: 18px; font-weight: bold; line-height: 24px;
    width: 979px;
    border-bottom: 1px solid silver;
}

.content-image-galleries ol.con-12 {
    margin-top: 5px;
}

.content-image-galleries .vignette{
    display: none;
}
.content-image-galleries .title {
    font-size: 14px; line-height: 1.2;
    margin-bottom: 5px;
}
.content-image-galleries .title img{
    /* fixing the position of the image */
    margin-top: -1px;
}

#wrapper-page .content-image-galleries .title a:hover {
    text-decoration: none;
}

div.band.band-3 {
    margin-top: 0;
}

div#content-images + div.con-12 {
    margin-top: 0;
}

/**************************************************************************
 * Site navigation, bottom
 **************************************************************************/
 #nav-siteindex ol li a,
 #regional-news ol li,
 #regional-news .region-link a,
 .teaser-carousel > div.header h2.title span,
 #content-latest .widget-itemlist .nav-context ul li a,
 ol.content-news li,
 #content-latest ol.content-news li,
 .teaser > .footer .related li a{
    background-color: transparent;
    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAMAAAAGCAYAAAAG5SQMAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAC1JREFUeNpiZGBg+A8EjECagQlEMDIy/gfRIGEwBcJgGWTwH6oPogdmAECAAQCx7hH7pRu3/gAAAABJRU5ErkJggg==);
    background-repeat: no-repeat;
}

#nav-siteindex{
/*    background: #dcdcdc url('g/siteindex/bg.gif') repeat-x; */
    overflow: hidden;
}

#nav-siteindex hr{
    float: left; clear: both; width: 100%;
    border: 0; background: none;
    visibility: hidden;
}

#nav-siteindex h2{
    color: #000;
    padding: 12px 0 16px 7px;
    font-size: 16px; font-weight: bold;
}

#nav-siteindex h3 a{
    font-size: 14px; font-weight: bold;
    color: #000;
    padding-left: 7px;
}

#nav-siteindex ul{ float:left; }

#nav-siteindex ol{
    padding: 4px 0 4px 7px;
    font-size: 14px;
    line-height: 24px;
    position: relative;
}

#nav-siteindex ol li a{
    display: block;
    color: #004276;
    padding: 0 0 0 7px;
    background-position: 0 9px;
    position: relative;
}

#nav-siteindex > div {
    border: 1px solid #dcdcdc;
    float: left;
    overflow: visible;
    width: 977px;
    padding-left: 0px;
    padding-top: 14px;

    -moz-border-radius: 3px;
    border-radius: 3px;

    background: #FFFFFF; /* old browsers */
    background: -moz-linear-gradient(top, #FFFFFF 0%, #EBECEC 100%); /* firefox */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#FFFFFF), color-stop(100%,#EBECEC)); /* webkit */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#FFFFFF', endColorstr='#EBECEC',GradientType=0 ); /* ie */
}


/*************************************************************************
 * Regional news, banner and blog list
 *************************************************************************/
#regional-news {
    margin-top: 30px;
}

#regional-news h3 {
    display: block; width: 315px;
    border-bottom: 1px solid silver;
    font-size: 18px; font-weight: bold; line-height: 24px;
}

#regional-news a.change-region-link {
    float: right;
    color: black;
    font-size: 10px;
}

    #regional-news .local-region {
        line-height: 23px;
        clear: both;
        height: 23px;
        padding: 2px;
        border-bottom: 1px dotted #D6D6D6;
        background: url(/img/regioner/bg.png) repeat-x;
    }

    #regional-news .local-region a {
        color: black;
    }

    #regional-news .local-region img {
        float: left;
    }


#regional-news ol li {
    border: none;
    padding-top: 2px; padding-bottom: 2px;
    background-position: 0 9px;
    padding-left: 7px;
}

#regional-news li span {
    display: inline; float: none;
    border: 0; padding: 0; margin: 0;
    font-size: 14px; line-height: 19px;
    color: gray;
}

#regional-news li a {
    display: inline-block;
    font-size: 14px; line-height: 19px;
}

#regional-news .region-link {
    border-top: 1px solid #dcdcdc;
    padding-top: 4px;
}

#regional-news .region-link a {
    background-position: left center;
    text-indent: 6px;
    padding-left: 6px;
}

#facebook {
    margin-top: 30px;
}


/* Start of Sputnik Show Case*/
.tv2-widget.teaser-carousel > div.header > h2.title > a {
    height: 29px;
    width: 119px;
    display: block;
    background: url(/css/g/sprites/logos.png) 0px -24px;
    margin-bottom: 2px;
}

.tv2-widget.teaser-carousel{
	min-height: 162px !important;
	background: none !important;
	background-color: #fff !important;
}

.tv2-widget.teaser-carousel > .header .title{
	width: 315px !important;
}

.teaser-carousel > div.header h2.title{
		z-index: 0 !important;
		background: none !important;
		text-indent: 0 !important;
		position: static !important;
}

.teaser-carousel > div.header h2.title span{
    display: block;
    position: absolute; top: 5px; right: 5px;

    background: transparent url('/css/g/sputnikshowcase/linkarrow.gif') no-repeat left center;
    background-position: 0 9px;

    color: #075993; font-size: 14px; line-height: 24px;
    font-weight: normal;
    text-indent: 7px;
}

.teaser-carousel .table-of-contents{
	display: none !important;
}

.teaser-carousel ol li{
	height: 162px !important;
	padding-bottom: 0 !important;
}

.teaser-carousel ol li div.header h2.title:hover > a span.entry-title{
	display: none;
}

.teaser-carousel ol li div.header h2.title > a span.entry-text{
	display: none;
}

.teaser-carousel ol li div.header h2.title:hover > a span.entry-text{
	display: inline;
}

.teaser-carousel ol li div.header h2.title a span.entry-title{
	font-family: arial;
	font-weight: bold !important;
	font-size: 15px !important;
	line-height: 19px !important;
	color: #fff !important;
	position: absolute;
	bottom: 0px;
	left: 0px;
	max-height: 88px;
	background: transparent;
	background-image: url('/css/g/sputnikshowcase/1x1transparent-50prc.png');
	padding: 5px !important;
	width: 305px !important;
	cursor: pointer;
}

.teaser-carousel ol li div.header h2.title a span.entry-title .entry-subtitle{
	font-size: 12px;
}

.teaser-carousel ol li div.header h2.title a span.entry-text{
	font-family: Arial;
	font-size: 12px !important;
	line-height: 16px !important;
	color: #fff !important;
	position: absolute;
	bottom: 0px;
	left: 0px;
	max-height: 162px;
	background: transparent;
	background-image: url('/css/g/sputnikshowcase/1x1transparent-50prc.png');
	padding: 5px 5px 5px 5px!important;
	width: 305px !important;
	cursor: pointer;
}

.teaser-carousel ol li div.header h2.title a span.entry-title span.entry-play,
.teaser-carousel ol li div.header h2.title a span.entry-text span.entry-play{
	font-size: 12px;
	font-weight: normal;
	line-height: 24px;
	width: 18px;
	text-indent: -9999px;
	float: right;
	background: transparent url('/css/g/sputnikshowcase/playbutton_small.png') no-repeat left center;
}

.teaser-carousel ol li div.header h2.title a span.entry-title span:hover{
	background: transparent url('/css/g/sputnikshowcase/playbutton_small.png') no-repeat right center;
}

.teaser-carousel ol li div.header h2.title img{
	margin: 0 !important;
}

.teaser-carousel ol li div.body.entry-summary{
	position: absolute;
	top: 120px;
	left: 0;
	font-family: verdana;
	font-size: 15px !important;
}

.teaser-carousel ol li div.aside {
	display: none !important;
}

.teaser-carousel ol li div.aside img{
	background: none !important;
	margin: 0 !important;
}

.teaser-carousel .tv2-widget {
    margin-top: 0;
}
/* End of Sputnik Show Case*/


/**= Newslist brush-up -------------------------------------------------- */
#content-latest .widget-itemlist {
    font-size: 14px;
    line-height: 23px;
}

#content-latest .widget-itemlist .nav-context {
    border-top: #ccc solid 1px;
    font-size: 12px;
}

#content-latest .widget-itemlist .nav-context ul {
    clear: both;
}

#content-latest .widget-itemlist .nav-context ul li a {
    padding-left: 7px;
    margin: 0px;
    background-position: left center;
    font-weight: normal;
}

#content-latest .widget-itemlist .nav-context ul li.subscribe {
    top: 0px; right: 0px;
}

#content-latest .widget-itemlist .nav-context ul li.subscribe a {
    background: transparent url('g/sprites/logos.png') no-repeat;
    width: 55px;
    height: 24px;
    padding: 0px;
}

#content-latest .widget-itemlist .nav-context ul li.left {
    float: left;
}

#content-latest .widget-itemlist .nav-context ul li {
    padding: 0px;
}

#content-latest .widget-itemlist .nav-context ul li.right {
    float: right;
}

#content-latest .widget-itemlist .header {
    border-bottom-color: #CCC;
    border-bottom-style: solid;
    border-bottom-width: 1px;
    height: 28px;
}

#content-latest .widget-itemlist .updated {
    color: gray;
    font-size: 12px;
}

#content-latest .widget-itemlist h2 {
    display: inline;
    border: none;
    padding: 0px;
    font-size: 18px;
    line-height: 24px;
}

#content-latest .widget-itemlist {
    border: none;
}

.widget-itemlist h3 {
    color: #000;
}

.widget-itemlist.most-read {
    margin-top: 30px;
}

ol.content-news {
   font-size: 14px;
   line-height: 19px;
   background: transparent;
}

ol.content-news li {
    border: none;
    padding-top: 2px;
    padding-bottom: 2px;
    padding-left: 7px;
    background-position: left 8px;
}

#content-latest ol.content-news li {
    background-position: left 9px;
}

ol.content-news li .time {
    border: none;
    display: inline;
    width: auto;
    float: none;
    font-size: 12px;
    color: gray;
}

ol.content-news li .time.red {
    white-space: nowrap;
    color: #BB0000;
}

/* End of Newslist brust-up */



/**=Teaser 'brushup' -------------------------------------------------------
 * Rules for the new teasers in the november frontpage brushup
 * -------------------------------------------------------------------------*/
.teaser {
    margin-top: 30px;
}

    .con-12 {
        margin-top: 30px;
        float: left;
    }
    .con-8 > .skin-8.teaser {
        margin-top: 0;
    }

    /* Default teaser link colors */
    /* NOTE; I'm prefixing these rules with '#top' to beat a previous rule */
    #top .teaser a {
        color: #000; text-decoration: none;
    }
    #top .teaser a:visited {
        /* @todo, define styles for visited */
        color: #000;
    }
    #top .teaser a:hover,
    #top .teaser a:focus {
        /* @todo, define styles for hover/focus */
        color: #000;
    }
    #top .teaser a:active {
        /* @todo, define styles for active */
    }


/**-Teasers header -------------------------------------------------------*/
.teaser > .header {
    /* Distance between header and article summary text */
    margin-bottom: 5px;
}

    .teaser.skin-3 > .header .title {
        font-size: 24px; font-weight: bold;
        line-height: 27px;
    }

    .teaser.skin-5 > .header .title {
        font-size: 24px; font-weight: bold;
        line-height: 27px;
    }

    body .teaser.skin-5 > .body.entry-summary {
        float: left; width: 100%;
    }

    .teaser.skin-8 > .header .title {
        font-size: 36px; font-weight: bold;
        line-height: 40px;
    }

    /* option: no-image --------------------------------------------------
     * Should hide the image
     * @usage: class="teaser no-image"
     *--------------------------------------------------------------------*/
    .teaser.skin-3.no-image > .header .title {
        font-size: 28px; font-weight: bold;
        line-height: 1.3;
    }

    .teaser.skin-3.no-image > .header .title img {
        display: none;
    }


/**-Teasers body ---------------------------------------------------------*/
.teaser > .body.entry-summary {
    position: static; float: none;
    margin-bottom: 10px;
}

    /* font sizes */
    .teaser.skin-3 > .body.entry-summary {
        font-size: 12px; line-height: 18px;
    }

    .teaser.skin-5 > .body.entry-summary {
        font-size: 14px; line-height: 19px;
    }
    .teaser.skin-8 > .body.entry-summary {
        font-size: 14px; line-height: 17px;
    }

    /* option: no-summary -------------------------------------------------
     * Should hide the teaser summary/body text
     * @usage: class="teaser no-summary"
     *--------------------------------------------------------------------*/
    .teaser.no-summary > .body.entry-summary {
        /* hide for visual user agents */
        position: absolute; left: -9999px; height: 0;
    }

    /* If there is no image, we should display a bigger header, and draw
     * a gradient as the background
     *
     * @todo, should this be a special class, that could be added to all
     *        teasers that needed this effect?
     *
     *        It could work like this class="teaser inverted"
     **/
    .teaser.skin-3.no-image {
        background: #000 url('g/icons/invertet-box-bg.png') repeat-x top left;

        background: -webkit-gradient(
            linear,
            left top,
            left bottom,
            color-stop(0.07, rgb(88,92,94)),
            color-stop(0.94, rgb(0,0,0))
        );
        background: -moz-linear-gradient(
            center top,
            rgb(88,92,94) 7%,
            rgb(0,0,0) 94%
        );

        color: #fff;
        padding: 10px 0;
    }

        /* inverted teasers should have some extra padding */
        .teaser.skin-3.no-image > .header,
        .teaser.skin-3.no-image > .body,
        .teaser.skin-3.no-image > .footer {
            padding: 0 10px;
        }

        /* invert the text too */
        #wrapper-page .teaser.skin-3.no-image a {
            color: #fff;
        }


/**-Teaser Footer (related) --------------------------------------------- */
.teaser > .footer .related {
    display: block; clear: both;
    width: 100%;
}

    .teaser > .footer .related > .header {
        /* hide the header for visual agents */
        position: absolute; left: -9999px;
    }

    .teaser > .footer .related > .body {
        width: 100%;
    }

    .teaser.skin-8 > .footer .related {
        width: 664px; /* act as a container spanning 8 grid units */
    }
        .teaser.skin-8 > .footer .related li {
            float: left;
            min-width: 315px; /* act as a col-4 */
            padding-right: 17px;
        }

    .teaser.skin-6 > .footer .related {
        width: 498px; /* act as a container spanning 6 grid units */
    }
        .teaser.skin-6 > .footer .related li {
            float: left;
            min-width: 232px; /* act as a col-3 */
            padding-right: 17px;
        }

    .teaser > .footer .related li a {
        display: inline-block;

        background-position: 0 5px;

        font-size: 12px; line-height: 16px;
        text-indent: 7px;
    }

        /* bullet graphics in inverted mode (bright color) */
        .teaser.skin-3.no-image > .footer .related li a {
            background-image: url('g/icons/brushup-bullet-white.gif');
        }

    /*=teaser related links color and state styles ---------------------- */
    #top .teaser > .footer .related li a {
        color: #004276;
    }

        #top .teaser > .footer .related li a:visited {
            color: #551a8b;
        }

        #top .teaser > .footer .related li a:hover,
        #top .teaser > .footer .related li a:focus {
            color: #0076d3;
            text-decoration: underline;
        }

        #top .teaser > .footer .related li a:active {
            color: #0076d3;
        }

    /*=teaser related links color and state styles, inverted colors------ */
    #top .teaser.skin-3.no-image > .footer .related li a {
        color: #fff;
    }

        #top .teaser.skin-3.no-image > .footer .related li a:visited {
            color: #777;
        }

        #top .teaser.skin-3.no-image > .footer .related li a:hover,
        #top .teaser.skin-3.no-image > .footer .related li a:focus {
            color: #0076d3;
        }

        #top .teaser.skin-3.no-image > .footer .related li a:active {
            color: #0076d3; background-color: #777;
        }


/**=Teaser 'image pull-out' ------------------------------------------------
 * A teaser type that inherets all the propperties of a normal teaser.
 * It will place it's image to the left, and all text next to it.
 * -------------------------------------------------------------------------*/
.teaser.skin-8.image-pull-out {
    position: relative;
    min-height: 131px; /* clear the images */
    margin-top: 30px;
}

    .teaser.skin-8.image-pull-out + .teaser.skin-8.image-pull-out {
        /* create a line between 'image pull-out'-teasers, this is done by
         * pushing it 14 pixels down (~half the margin between teasers (30px));
         * drawing the line using a border; and create some space to the
         * content by using padding. */
        border-top: 1px solid #ccc;
        padding-top: 14px;
        margin-top: 14px;
    }

.teaser.skin-8.image-pull-out > .header,
.teaser.skin-8.image-pull-out > .body,
.teaser.skin-8.image-pull-out > .footer {
    float: none;
    padding-left: 249px; /* the width of 3 grid unites */
}

    .teaser.skin-8.image-pull-out > .header img {
        position: absolute; left: 0;
    }

    .teaser.skin-8.image-pull-out > .header .title {
        position: static;
        display: block; clear: both;
        font-size: 24px; font-weight: bold;
        line-height: 27px;
    }

    .teaser.skin-8.image-pull-out > .body {
        line-height: 19px;
    }

/* creating the 'emphasised' teaser, at the bottom of the first teaser deck */
.bottom > .teaser.skin-5 {
    display: block; width: 396px;
    position: relative;

    background: #dfdfdf;
    background: -webkit-gradient(
        linear,
        left bottom,
        left top,
        color-stop(0.08, rgb(235,235,236)),
        color-stop(0.75, rgb(253,253,253))
    );
    background: -moz-linear-gradient(
        center bottom,
        rgb(235,235,236) 8%,
        rgb(253,253,253) 75%
    );

    padding: 0; padding-bottom: 5px;
    border: 1px solid rgb(220,220,220);
    -moz-border-radius: 2px; -webkit-border-radius: 2px; border-radius: 2px;
}
.bottom > .teaser.skin-5 {
    display: block;
}

    /* add some padding to the sides */
    .bottom > .teaser.skin-5 > .header .entry-title,
    .bottom > .teaser.skin-5 > .body,
    .bottom > .teaser.skin-5 > .footer {
        padding: 0 5px;
    }

    body .bottom > .teaser.skin-5 > .body {
        /* body is otherwise to wide with the border */
        width: 388px;
    }

    .bottom > .teaser.skin-5 > .header img {
        position: absolute; top: 0; left: 0;
    }

    .bottom > .teaser.skin-5 > .header .entry-title {
        padding-top: 228px;
        display: block;
    }

    /* create the gray border */
    .bottom > .teaser.skin-5 > .body,
    .bottom > .teaser.skin-5 > .footer {
        float: none; position: static; /* cancel previous rules */
        margin: 0; padding: 5px;
        font-size: 14px; line-height: 19px;
    }

        .bottom > .teaser.skin-5 > .footer .related {
            /* ie7:fix a issue with narrow list items */
            width: 100%;
        }

    .bottom .con-3 .header .title {
        font-size: 16px; line-height: 19.2px;
    }


/**=Tema (theme island) ----------------------------------------------------
 * A group of teasers, with an inverted color scheme, grouped under one
 * headline. Teasers within the island inherits its margins from the other
 * teasers, but will get an 5 pixel margin to its sides on the body, header
 * and footer.
 * -------------------------------------------------------------------------*/
.col-8.tema {
    margin-top: 30px;
}

    .col-8.tema .teaser:first-child {
        margin-top: 0;
    }

    /**-tema header --------------------------------------------------------*/
    .col-8.tema > .header .title {
        font-size: 18px; font-weight: bold;
        line-height: 24px;
    }

    .col-8.tema .con-3 .teaser:first-child > .header .title {
        font-size: 24px; line-height: 27px;
    }


    /**-tema body ----------------------------------------------------------*/
    .col-8.tema > .body {
        width: 664px; /* width of 8 grid units */
        overflow: hidden; /* force the element not to collapse */

        background: #000 url('g/icons/invertet-box-bg.png') repeat-x top left;

        background: -webkit-gradient(
            linear,
            left top,
            left bottom,
            color-stop(0.07, rgb(88,92,94)),
            color-stop(0.94, rgb(0,0,0))
        );
        background: -moz-linear-gradient(
            center top,
            rgb(88,92,94) 7%,
            rgb(0,0,0) 94%
        );

        padding-top: 5px; padding-bottom: 10px;
    }

    /**-tema teasers -------------------------------------------------------*/
    .col-8.tema > .body .teaser > .header,
    .col-8.tema > .body .teaser > .body,
    .col-8.tema > .body .teaser > .footer {
        margin-left: 5px; margin-right: 5px;
        color: #fff;
    }

    /**-tema teaser header -------------------------------------------------*/
    .col-8.tema > .body .teaser > .header .entry-title {
        color: #fff;
    }

    .col-8.tema .teaser.skin-3 > .header .title {
        font-size: 16px; line-height: 22px;
    }


    /**-tema teasers link states -------------------------------------------*/
    #top .col-8.tema > .body .teaser > .footer .related li a {
        background-image: url('g/icons/brushup-bullet-white.gif');
        color: #fff;
    }

        #top .col-8.tema > .body .teaser > .footer .related li a:visited {
            color: #777;
        }

        #top .col-8.tema > .body .teaser > .footer .related li a:hover,
        #top .col-8.tema > .body .teaser > .footer .related li a:focus {
            color: #0076d3;
        }

        #top .col-8.tema > .body .teaser > .footer .related li a:active {
            color: #0076d3;
            background-color: #777;
        }


/***************************************************************************
 * MOST READ
 **************************************************************************/
.most-read .header h2 {
    font-size: 18px;
    line-height: 24px;
    font-weight: bold;
}

.most-read ol {
    list-style-type: none;
}
.most-read ol li {
    border: none;
    display: list-item;
    line-height: 18px;
    padding: 4px 0px;
    background-image: none;
}
.most-read ol li a {
    text-decoration: none;
    font-size: 14px;
    background-image: none;
    width: 274px;
    display: inline-block;
}
.most-read ol li span.num {
    border: none;
    font-size: 18px;
    font-weight: bold;
    color: #000;
    display: inline-block;
    width: 1.4em;
    text-align: right;
}


/*************************
 * Flere tophistorier    *
 *************************/

#deck-2 > .con-12 > .header {
    font-size: 22px;
    font-weight: bold;
    line-height: 29px;
    margin-top: 0px;
}

#deck-2 > .con-12 > .header .title {
    font-size: 18px;
    border-bottom: 1px solid silver;
    display: block;
    width: 979px;
}

#deck-2 > .con-12 > .body {
    margin-top: 2px;
    padding-top: 8px;
}

#deck-2 > .con-12 > ul li h3 a {
    font-size: 14px;
    font-weight: bold;
    line-height: 24px;
}

#nav-siteindex {
    margin-top: 0;
}

#nav-siteindex h2 {
    font-size: 18px;
    font-weight: bold;
    line-height: 29px;
    margin-top: 8px;
    padding: 0;
    border: 0;
}

#nav-siteindex .con-12 {
    margin-top: 0;
}

.band.band-3.con-8 {
    float: left;
}


/* Bingo-banko teasere -------------------------------------------------- */
.col-4.cross-promo-315x80 {
    margin-top: 30px;
}
.col-4.cross-promo-315x80 a {
    display: block;
    text-indent: -9999px;
    height: 80px; width: 315px;
    background-position: top left;
    background-repeat: no-repeat;
    background-color: transparent;
}


/* Downtown ad ---------------------------------------------------------- */
#downtown-ad {
    margin-top: 0;
}


/**=Section Teaser Group ------------------------------------------------ */
.section-teaser-group {
    margin-top: 30px;
}

    .section-teaser-group > .body {
        background-repeat: no-repeat;
        background-position: top left;
        float: left;
        font-size: 14px; line-height: 24px;
    }

    .section-teaser-group > .body ol {
        width: 332px;
    }

    .section-teaser-group > .body ol li {
        width: 149px; margin-right: 17px;
        float: left;
    }
    .section-teaser-group > .body ol li .entry-title {
        display: block;
        font-weight: bold;
    }

    .section-teaser-group > .body ol li img {
        width: 145px; border: 2px solid #3888ba;
        line-height: 0;
    }

        .section-teaser-group > .body ol li:first-child {
            width: 315px;
        }

        .section-teaser-group > .body ol li:first-child img {
            float: left;
        }

/**=go teaser group ----------------------------------------------------- */
.section-teaser-group.go > .header {
    position: relative;
    font-weight: bold;
    min-height: 50px;
}
    .section-teaser-group.go > .header strong {
        display: block; width: 70px; height: 50px;
        position: absolute; bottom: 0; left: 0;

        text-indent: -9999px;
        background: #fff url('g/sprites/logos.png') no-repeat 0px -83px;
    }

    .section-teaser-group.go > .header span {
        display: block;
        position: absolute; bottom: 8px;
        padding-left: 75px;
        color: #000; font-weight: bold;
    }

.section-teaser-group.go > .body {
    background: #000 url('g/icons/invertet-box-bg.png') repeat-x top left;

    background: -webkit-gradient(
        linear,
        left top,
        left bottom,
        color-stop(0.07, rgb(88, 92, 94)),
        color-stop(0.94, rgb(22, 24, 24))
    );
    background: -moz-linear-gradient(
        center top,
        rgb(88, 92, 94) 7%,
        rgb(22, 24, 24) 94%
    );
}

.section-teaser-group.go > .body li {
    position: relative;
    min-height: 156px;
}

.section-teaser-group.go > .body img {
    width: 141px; height: 102px;
    border-color: transparent; /* 2 px border, inherit */
    padding: 2px 2px 0 2px;
    position: absolute; top: 0; left: 0; right: 0;
}

    .section-teaser-group.go > .body li:first-child img {
        width: 307px; height: 160px;
    }


.section-teaser-group.go > .body li .entry-title {
    display: block;
    padding: 108px 8px 10px 8px;
    color: #fff; font-weight: normal;
}

    .section-teaser-group.go > .body li:first-child .entry-title {
        padding-top: 165px;
        font-weight: bold;
    }

#wrapper-page .section-teaser-group.go > .body a,
#wrapper-page .section-teaser-group.go > .body a:focus,
#wrapper-page .section-teaser-group.go > .body a:hover {
    color: #fff;
}

/**=spil teaser group --------------------------------------------------- */
.section-teaser-group.spil > .header {
    padding-bottom: 3px;
}

    .section-teaser-group.spil > .header a {
        display: block;
        background: url('g/sprites/logos.png') no-repeat 0px -53px;
        padding-left: 115px;
        line-height: 30px;
        font-weight: bold;
    }

    #wrapper-page .section-teaser-group.spil > .header a {
        color: #000;
    }

    #wrapper-page .section-teaser-group.spil > .body a {
        color: #fff;
    }

.section-teaser-group.spil > .body ol li:first-child {
    position: relative;
}

    .section-teaser-group.spil > .body ol li img {
        width: 145px; border: 2px solid #3888ba;
        line-height: 0;
    }

    .section-teaser-group.spil > .body ol li:first-child img {
        width: 311px; height: 160px;
    }

    .section-teaser-group.spil > .body ol li:first-child .entry-title {
        position: absolute; bottom: 2px; left: 2px; right: 2px;
        z-index: 2;
        background: rgb(54, 131, 183);
        background: rgba(54, 131, 183, 0.75); /* todo, get the correct color */
    }

    .section-teaser-group.spil > .body ol li .entry-title {
        padding: 14px 8px 8px 8px;
    }

.section-teaser-group.spil > .footer {
    display: none;
}

/* Hax to  make the realted links work*/
.teaser.image-pull-out > .footer > .related > .body > ul > li {
    clear: left;
}

.keep-tv2-banner {
    padding: 10px 0px 0px 0px;
}

