/* CSS INCULDES */
@import url(archive-related-links.css);     /* ARCHIVE  */

/*  */

/* W only has ListA (item list with vertical image at list level) and ListC (slideshow with possible vertical image at list level) */

/* LIST STYLES */

.list {
    position: relative;
}

.editlink {
    display: none;
}

.disabled {
    opacity: .4;
    *filter: alpha(opacity=40);
}

/* INTRO SWITCHING STYLES */

.listC .intro-container {
    position: absolute;
    left: -9999px;
}

html.slideshow-showintro-true .intro-container {
    position: relative;
    left: 0;
}

html.slideshow-hasintro-true #items-container,
html.slideshow-hasintro-true .cr-item {
    position: absolute;
    left: -9999px;
}

html.slideshow-hasintro-true .intro-container {
    position: relative;
    left: auto;
}

html.slideshow-showinitial-true #items-container .item {
    display: block;
}

html.slideshow-showinitial-false #items-container .item {
    display: none;
}

.list-view-slideshow {
    background: url(i/slide/slideshow-view-btn.gif) no-repeat left top;
    cursor: pointer;
    display: block;
    height: 0;
    margin: 15px 0 15px 0;
    overflow: hidden;
    padding: 15px 105px 0 0;
    text-indent: -9999px;
    width: 0;
}

    .list-view-slideshow:hover {
        background-color: none;
        background-position: 0 -15px;
    }

.list-backto {
    color: #444;
    cursor: pointer;
    font: 11px arial, helvetica, sans-serif;
    margin: 10px 0 5px 0;
    text-transform: uppercase;
}

    .list-backto:hover {
        text-decoration: underline;
    }

/* PRIMARY TYPOGRAPHY */

/* copy from global.css necessary for view larger */

.slideshow-view-larger-container p { /* copied from global .pc p style */
    font-size: 13px;
    line-height: 1.3em;
    padding-bottom: 1em;
}
.slideshow-view-larger-container .body {
    font-size: 13px;
}

/* list styles */

.pc .rubric,
.slideshow-view-larger-container .rubric {
    font: normal 12px arial, helvetica, sans-serif;
}

    .pc .rubric a,
    .slideshow-view-larger-container .rubric a {
        color: #000;
    }

        .pc .rubric a:hover,
        .slideshow-view-larger-container .rubric a:hover {
            color: #525d60;
        }

.pc .content-headline {
    color: #000;
    font-size: 40px;
    font-weight: normal;
    line-height: 50px;
    text-transform: uppercase;
}

    .pc .content-headline a {
        color: #000;
    }

        .pc .content-headline a:hover {
            color: #5985a0;
        }

.pc .sub-header {
    color: #000;
    font: normal 13px/1.25em "trebuchet ms", corbel, "lucida grande", sans-serif;
    margin-top: 13px;
}

.pc
.slideshow-view-larger-container .byline {
    color: #5985a0;
    font: bold 11px "trebuchet ms", corbel, "lucida grande", sans-serif;
    margin-top: 8px;
}

    .pc .byline .label,
    .slideshow-view-larger-container .byline .label {
        color: #000;
        font: normal 11px georgia, "times new roman", times, serif;
    }

    .pc .byline a,
    .slideshow-view-larger-container .byline a {
        font: bold 11px "trebuchet ms", corbel, "lucida grande", sans-serif;
    }

.pc .display-date,
.slideshow-view-larger-container .display-date {
    color: #000;
    font: normal 11px georgia, "times new roman", times, serif;
    margin-top: 8px;
}

.item .byline {
    margin-top: 1em;
}

.item .embedded-list li {
    /*list-style-type: none;*/
    margin-bottom: 10px;
}

    .item .embedded-list li strong {
        color: #999;
        display: block;
        font-weight: normal;
        text-transform: lowercase;
    }

/* PRIMARY LAYOUT */

.itemA .pc,
.itemB .pc { /* for item page */
    padding: 80px 22px 0 34px;
    width: 590px;
}

.headers-container:after,
.intro-container:after {
    clear: both;
    content: ".";
    display: block;
    height: 0;
    visibility: hidden;
    *zoom: 1;
}

.headers-container {
    clear: both;
}

.intro-container {
    clear: both;
    margin: 20px 0 0 0;
}

#items-container {
    clear: both;
    margin: 30px 0 0 0;
    padding: 30px 0 0 0;
    position: relative;
    *zoom: 1; /* IE6 might need this to position view all box correctly, else it animates from the bottom of the screen (sometimes) Also IE7 needs it in order to switch between intro and items container */
}

.list .pagination {
    clear: both;
}

.list .intro-container {
    float: left;
    width: 590px;
}

    .list .intro-container .lead-introduction {
        float: left;
        font: bold 26px/1em "trebuchet ms", corbel, "lucida grande", sans-serif;
        text-transform: uppercase;
        width: 270px;
    }

    .list .intro-container .intro-text-body {
        float: right;
        width: 270px;
    }

.list .list-supporting {
    clear: both;
    padding-top: 20px;
}

/* THUMBNAILS - only relevant with slideshow */

.list .thumbnails ul,
.list .thumbnails li {
    list-style: none;
    margin: 0;
    padding: 0;
}

    .list .thumbnails li {
        float: left;
        margin-right: 10px;
    }

/* ITEM PAGE */

.item {
    clear: both;
    float: left;
    font: normal 12px/18px georgia, "times new roman", times, serif;
}

    .item .headers-container {
        margin-top: 20px;
    }

    .item .item-text {
    }

        .item .item-text .lead-introduction {
            margin-top: 20px;
        }

        .item .item-text .text {
            margin-top: 20px;
        }

        .item .embedded-list {
            margin: 20px 0 0 20px;
        }

    .item .item-inner {
        border: 1px dotted #BBBBBB;
        padding: 14px 26px 50px 26px;
        position: relative;
    }

        .item-inner h1.content-headline { /* targets headline in item on item page */
            font-size: 32px;
        }

        .itemA .item-inner .rubric,
        .itemB .item-inner .rubric {
            background: #fff;
            border: 2px solid #070707;
            display: inline;
            font: bold 16px georgia, "times new roman", times, serif;
            left: 26px;
            padding: 2px 22px;
            position: absolute;
            top: -14px;
        }

.itemA {

}

    .itemA .item-inner {


        margin-top: 34px;
        width: 504px;
    }

.itemB {

}

    .itemB .captioned-photo,
    .itemB .item .captioned-photo {
        float: left;
    }

    .itemB .item-inner {
        border-left:1px dotted #BBBBBB;
        border-width: 1px 1px 1px 1px;
        float: left;
        _height: 324px;
        min-height: 314px;
        width: 237px;
    }

/* ITEM LIST PAGE */

.listA .pc {
    padding: 80px 12px 0 12px;
    width: 626px;
}

.listA .list .sub-header {
    font-size: 17px;
}

.listA #items-container {
    border-top: 1px solid #f6a00f;
}

.listA .list .item {
    border-bottom: 1px solid #f6a00f;
    margin-bottom: 23px;
    padding-bottom: 23px;
    width: 624px;
}

.listA .list .captioned-photo {
    float: left;
    margin-right: 40px;
}

    .listA .list .captioned-photo img {
        width: 300px;
    }

.listA .list .headers-container {
    clear: none;
}

    .listA .list .item h3 {
        font: bold 14px georgia, "times new roman", times, serif;
    }

    .listA .list .item .sub-header {
        font-size: 13px;
    }

.listA .list .item .captioned-photo {
    width: 300px;
}

    .listA .list .item .captioned-photo .w {
        border: 1px solid #efefef;
        display: block;
        margin: 0 auto;
        width: 171px;
    }

        .listA .list .item .captioned-photo img {
            width: 171px;
        }

    .listA .list .item-inner {
        background: none;
        border: 0;
        float: left;
        _height: 0;
        min-height: 0;
        margin-top: 0;
        padding: 0;
        width: 237px;
    }

        .listA .list .item-inner .item-text {
            overflow: hidden;
        }

.listA .list .item .detail {
    margin-top: 15px;
}

    .listA .list .item .detail a {
        background: url(i/icons/red-arrow.gif) right 3px no-repeat;
        display: inline;
        font: bold 11px Georgia, "times new roman", times, serif;
        padding-right: 18px;
    }

        .listA .list .item .detail a:hover {
            background-position: right -10px;
        }

/* SLIDESHOW PAGE */

.listC .pc {
    padding: 30px 26px 0 34px;
    width: 590px;
}

    .listC #items-container {
        margin-top: 10px; /* overriding - item list has top border and needs both margin and padding */
        padding-top: 0;
    }

    .listC .list .items {
        border: solid #cacaca;
        border-width: 0 1px;
        height: 550px; /* change to height of design */
        position: relative;
        overflow: hidden;
        width: 588px;
    }

    .listC .list .captioned-photo {
        border: 0px solid #cacaca;
        text-align: center;
    }

    .listC .list .intro-container .captioned-photo {
        border-width: 1px;
    }

        .listC .list .captioned-photo img {
            display: inline;
        }

        .listC .list .captioned-photo .caption {
            background: #fff;
            bottom: 0;
            color: #000;
            font-size: 11px;
            left: 0;
            opacity: .8;
            _filter: alpha(opacity=80);
            padding: 8px 10px;
            position: absolute;
            text-align: left;
        }

    .listC .list .item {
        background: #fff;
        color: #000;
        left: 0;
        position: absolute;
        top: 0;
    }

    .listC .list .itemA {
        padding-left: 0;
        padding-top: 441px;
        width: 588px;
    }

        .listC .list .itemA .captioned-photo {
            border-width: 0 0 1px 0;
            height: 440px; /* change to horizontal img height */
            left: 0;
            margin: 0;
            overflow: hidden;
            position: absolute;
            top: 0;
            width: 588px;
        }

            .listC .list .itemA .captioned-photo .caption {
                width: 568px;
            }

        .listC .list .itemA .item-inner {
            height: 109px; /* change */
            padding: 0 15px;
            width: auto;
        }

    .listC .list .itemB {
        padding-left: 398px; /* change */
        width: 190px; /* change */
    }

        .listC .list .itemB .captioned-photo {
            border: 1px solid #cacaca;
            border-width: 0 1px 0 0;
            height: 550px; /* change */
            left: 0;
            overflow: hidden;
            position: absolute;
            top: 0;
            width: 397px; /* change */
        }

            .listC .list .itemB .captioned-photo .caption {
                width: 397px;
            }

        .listC .list .itemB .item-inner {
            height: 550px; /* change */
            padding: 0 5px 0 15px;
            width: 170px; /* change */
        }

    .listC .list .item .captioned-photo {
        display: table;
    }

        .listC .list .item .captioned-photo .w {
            display: table-cell;
            vertical-align: middle;
        }

    .listC .list .item-inner {
        background: #fff;
        border: 0;
        margin-top: 0; /* overriding the item page here */
    }

    .listC .list .item .headers-container {
        margin-top: 9px;
        padding: 9px 15px 0 0;
        width: auto;
    }

        .listC .list .item .content-headline {
            font-size: 20px;
            line-height: 1em;
        }

            .listC .list .item .content-headline a {
            }

                .listC .list .item .content-headline a:hover {
                }

    .listC .list .item .sub-header {
        margin-top: 7px;
    }

    .listC .list .item-inner,
    .listC .list .item-inner .body,
    .listC .list .item-inner .lead-introduction {
    }

    .listC .list .item-inner .lead-introduction {
        margin-top: 8px;
    }

    .listC .list .item-text {
        margin-top: 0;
        padding: 0;
        width: auto;
    }

        .listC .list .item-text .text {
            margin-top: 8px;
        }

    .listC .list .embedded-list {
        margin-left: 15px;
    }

/* interstitial continue */

.slideshow-advertisement-note {
    color: #a4a4a4;
    font-family: arial, sans-serif;
    font-size: 10px;
    left: 145px;
    position: absolute;
    top: 105px;
}

    .slideshow-view-larger-container .slideshow-advertisement-note {
        left: 301px;
        top: 80px;
    }

.slideshow-continue {
    color: #444;
    font-family: arial, sans-serif;
    font-size: 9px;
    left: 145px;
    position: absolute;
    text-align: center;
    text-transform: uppercase;
    top: 381px;
    width: 300px;
}

    .slideshow-continue-link {
        border: 1px solid #cacaca;
        display: block;
        font-size: 10px;
        font-weight: bold;
        margin: 10px auto 0;
        padding: 3px 0;
        width: 146px;
    }

        .slideshow-continue-link:hover {
            background-color: #eee;
            color: #000;
        }

.slideshow-view-larger-container .slideshow-continue {
    left: 301px;
    top: 381px;
}

/* iframe ad */

.slideshow-dartinterstitial {
    border: 0;
    height: 250px;
    left: 145px;
    overflow: hidden;
    position: absolute;
    top: 120px;
    width: 300px;
}

    .slideshow-view-larger-container .slideshow-dartinterstitial {
        left: 301px;
        top: 100px;
    }

/* slideshow controls */

.slideshow-loading {
    width: 590px;
    height: 24px;
    position: absolute;
    top: 0;
    left: 0;
    background: url(i/slide/slideshow-nav.gif) 0 -168px;
    opacity: .5;
    *filter: alpha(opacity=50);
}

    #show-footer .slideshow-loading {
        background-position: 0 -192px;
    }

.slideshow-loading-message {
    background: #fff url(i/icons/loader.gif) no-repeat center 30px;
    border: 1px solid #777;
    font-size: 10px;
    height: 35px;
    left: 217px;
    opacity: .85;
    *filter: alpha(opacity=85);
    padding: 10px;
    position: absolute;
    text-align: center;
    text-transform: uppercase;
    top: 200px;
    width: 126px;
}

.control-bar {
    position: relative;
    z-index: 1;
    text-indent: -9999px;
    height: 24px;
    width: 590px;
}

    #show-header {
        background: url(i/slide/slideshow-nav.gif) 0 0 no-repeat;
    }

    #show-footer {
        background: url(i/slide/slideshow-nav.gif) 0 -24px no-repeat;
    }

.control-bar a {
    background: url(i/slide/slideshow-nav.gif);
    display: block;
    float: left;
    cursor: pointer;
    height: 24px;
    border-bottom: none !important;
}

    .control-bar .start a {
        background-position: 0 -48px;
        width: 52px;
    }

        .control-bar .start a:hover {
            background-position: 0 -72px;
        }

        #show-footer .start a {
            background-position: 0 -96px;
        }

        #show-footer .start a:hover {
            background-position: 0 -120px;
        }

    .control-bar .stop {
        display: none;
    }

    .control-bar .stop a {
        background-position: -260px -48px;
        width: 52px;
    }

        .control-bar .stop a:hover {
            background-position: -260px -72px;
        }

        #show-footer .stop a {
            background-position: -260px -96px;
        }

        #show-footer .stop a:hover {
            background-position: -260px -120px;
        }

    .control-bar .viewlarger a {
        background-position: -53px -48px;
        width: 77px;
    }

        .control-bar .viewlarger a:hover {
            background-position: -53px -72px;
        }

        #show-footer .viewlarger a {
            background-position: -53px -96px;
        }

        #show-footer .viewlarger a:hover {
            background-position: -53px -120px;
        }

    .control-bar .viewall a {
        background-position: -130px -48px;
        width: 130px;
    }

        .control-bar .viewall a:hover,
        .control-bar .viewall a.slideshow-navigation-viewall-visible {
            background-position: -130px -72px;
        }

        #show-footer .viewall a {
            background-position: -130px -96px;
        }

        #show-footer .viewall a:hover,
        #show-footer .viewall a.slideshow-navigation-viewall-visible {
            background-position: -130px -120px;
        }

    .control-bar .previous a {
        background-position: -398px -48px;
        position: absolute;
        right: 115px;
        top: 0;
        width: 77px;
    }

        .control-bar .previous a:hover {
            background-position: -398px -72px;
        }

        #show-footer .previous a {
            background-position: -398px -96px;
        }

        #show-footer .previous a:hover {
            background-position: -398px -120px;
        }

    .control-bar .count {
        color: #111;
        font-family: arial, helvetica, sans-serif;
        font-size: 9px;
        line-height: 24px;
        position: absolute;
        right: 55px;
        text-align: center;
        text-indent: 0;
        width: 60px;
    }

        #show-footer .count {

        }

    .control-bar .next a {
        background-position: -535px -48px;
        position: absolute;
        right: 0;
        top: 0;
        width: 55px;
    }

        .control-bar .next a:hover {
            background-position: -535px -72px;
        }

        #show-footer .next a {
            background-position: -535px -96px;
        }

        #show-footer .next a:hover {
            background-position: -535px -120px;
        }

/* jScrollPane */

.jScrollPaneContainer {
    overflow: hidden;
    position: relative;
    z-index: 1;
    height: 400px; /* what is this height? */
}

.jScrollPaneTrack {
    background: url(i/slide/slideshow-scrollbars.gif) repeat-y -14px 0;
    cursor: pointer;
    height: 100%;
    position: absolute;
    right: 0;
    top: 0;
}

.jScrollPaneDrag {
    background: url(i/slide/slideshow-scrollbars.gif) no-repeat 0 50%;
    cursor: pointer;
    overflow: hidden;
    position: absolute;
}

.jScrollPaneDragTop {
    background: url(i/slide/slideshow-scrollbars.gif) no-repeat -56px 0;
    height: 5px;
    left: 0;
    overflow: hidden;
    position: absolute;
    top: 0;
}

.jScrollPaneDragBottom {
    background: url(i/slide/slideshow-scrollbars.gif) no-repeat -70px 0;
    bottom: 0;
    height: 5px;
    left: 0;
    overflow: hidden;
    position: absolute;
}

a.jScrollArrowUp {
    background: url(i/slide/slideshow-scrollbars.gif) no-repeat -28px 0;
    display: block;
    height: 14px;
    overflow: hidden;
    position: absolute;
    right: 0;
    text-indent: -9999px;
    top: 0;
    z-index: 1;
}

    a.jScrollArrowUp:hover {
        background-position: -28px -14px;
    }

    a.jScrollArrowUp:active {
        background-position: -28px -28px;
    }

    a.jScrollArrowUp.disabled {
        background-position: -28px -42px;
        opacity: 1;
        *filter: alpha(opacity=100);
    }

    #content a.jScrollArrowUp {
        _background-position: -28px 0;
    }

a.jScrollArrowDown {
    background: url(i/slide/slideshow-scrollbars.gif) no-repeat -42px 0;
    bottom: 0;
    display: block;
    height: 14px;
    overflow: hidden;
    position: absolute;
    right: 0;
    text-indent: -9999px;
    z-index: 1;
}

    a.jScrollArrowDown:hover {
        background-position: -42px -14px;
    }

    a.jScrollArrowDown:active {
        background-position: -42px -28px;
    }

    a.jScrollArrowDown.disabled {
        background-position: -42px -42px;
        opacity: 1;
        *filter: alpha(opacity=100);
    }

    #content a.jScrollArrowDown {
        _background-position: -42px 0;
    }

/* NAVIGATION OBJECTS */

/* carousel */

#items-container .jcarousel-container {
    background: #fff;
    border: solid #cacaca;
    border-width: 1px 1px 0 1px;
    clear: both;
    position: relative;
    width: 588px; /* change to width of entire slideshow player, though maybe not necessary since it's overridden later */
}

#items-container .jcarousel-clip {
    margin: 0;
    overflow: hidden;
    padding: 0;
    position: relative;
    z-index: 2;
}

#items-container .jcarousel-list {
    left: 0;
    margin: 0;
    overflow: hidden;
    padding: 0;
    position: relative;
    top: 0;
    z-index: 1;
}

#items-container .jcarousel-list li,
#items-container .jcarousel-item {
    float: left;
    list-style: none;
    /* width and height must be set explicitly */
    height: 126px; /* change - ? I think it gets overwritten anyway */
    padding-top: 12px;
    position: relative;
    width: 111px; /* change - dimension from left edge to left edge - entire item - I think it gets overwritten anyway */
}

#items-container .jcarousel-list li.active {
    background: url(i/icons/red-arrow-up.gif) no-repeat center bottom;
}

    #items-container .jcarousel-list li a {
        border: 1px solid #fff;
        display: block;
        background: #fff;
        height: 111px; /* change to match img + border */
        width: 109px; /* change to match img + border */
    }

        #items-container .jcarousel-list li.active a {
            border: 1px solid #9c9c9c;
        }

    #items-container .jcarousel-item img {
        border: solid #fff;
        border-width: 5px 4px;
        display: block;
        height: 101px; /* change - actual image */
        opacity: .7;
        *filter: alpha(opacity=70);
        width: 101px; /* change - actual image */
    }

        #items-container .slideshow-navigation-carousel .active img {
             /* border: 1px solid #fff; change color */
            opacity: 1;
            *filter: alpha(opacity=100);
        }

        #items-container .slideshow-carousel a:hover img,
        #items-container .slideshow-navigation-carousel a:hover img {
            /* border: 1px solid #fff; change color */
            opacity: 1;
            *filter: alpha(opacity=100);
        }

    #items-container .slideshow-carousel li span,
    #items-container .slideshow-navigation-carousel li span {
        display: block;
        font-size: 10px;
        left: 0;
        line-height: 1.2em;
        position: absolute;
        text-align: center;
        top: 0;
        width: 109px; /* change - image width + border */
    }

#items-container .jcarousel-next {
    display: none;
    z-index: 3;
}

#items-container .jcarousel-previous {
    display: none;
    z-index: 3;
}

/* carousel skin */

#items-container .jcarousel-skin-default .jcarousel-container {
    font-family: arial, sans-serif;
    font-size: .8em;
}

#items-container .jcarousel-skin-default .jcarousel-container-horizontal { /* padding + width = whole carousel */
    padding: 7px 17px 5px 16px; /* change - design l/r padding */
    width: 555px; /* change - individual width * number, and then adjust padding to add up to total and margin the ruleset below */
}

#items-container .jcarousel-skin-default .jcarousel-clip-horizontal { /* note that setting display inline will not work, so double margin float bug will happen if you need a right or left margin. Have to hack for IE and set its margin to 1/2 the amount to compensate for this bug */
    height: 144px;
    margin: 0 0 0 0; /* difference between padding above and padding in design */
    _margin: 0 0 0 3px; /* compensate for double margin float bug, believe me, it's necessary to do it this way */
    width: 555px; /* change to match container width above */
    _width: 549px; /* this might be good for everyone, but ie is the only one that strictly requires it to keep the box from blowing out */
}

#items-container .jcarousel-skin-default .jcarousel-item {
    height: 126px; /* change */
    width: 111px; /* change - viewable area / number visible, actual edge-to-edge width */
}

#items-container .jcarousel-skin-default .jcarousel-item-horizontal {
    margin: 0;
}

#items-container .jcarousel-skin-default .jcarousel-item-placeholder {
    background: #fff;
    color: #000;
}

/* carousel buttons */

#items-container .jcarousel-skin-default .jcarousel-next-horizontal {
    background: url(i/slide/slideshow-nav.gif) no-repeat -225px -144px;
    cursor: pointer;
    height: 24px;
    position: absolute;
    right: 0; /* change - design */
    top: 62px; /* change if necessary */
    width: 18px;
}

    #items-container .jcarousel-skin-default .jcarousel-next-horizontal:hover {
        background-position: -243px -144px;
    }

    #items-container .jcarousel-skin-default .jcarousel-next-horizontal:active {

    }

    #items-container .jcarousel-skin-default .jcarousel-next-disabled-horizontal,
    #items-container .jcarousel-skin-default .jcarousel-next-disabled-horizontal:hover,
    #items-container .jcarousel-skin-default .jcarousel-next-disabled-horizontal:active {
        background-position: -279px -144px;
        cursor: default;
    }

#items-container .jcarousel-skin-default .jcarousel-prev-horizontal {
    background: url(i/slide/slideshow-nav.gif) no-repeat -153px -144px;
    cursor: pointer;
    height: 24px;
    left: 0; /* change - design */
    position: absolute;
    top: 62px; /* change if necessary */
    width: 18px;
}

    #items-container .jcarousel-skin-default .jcarousel-prev-horizontal:hover {
        background-position: -171px -144px;
    }

    #items-container .jcarousel-skin-default .jcarousel-prev-horizontal:active {

    }

    #items-container .jcarousel-skin-default .jcarousel-prev-disabled-horizontal,
    #items-container .jcarousel-skin-default .jcarousel-prev-disabled-horizontal:hover,
    #items-container .jcarousel-skin-default .jcarousel-prev-disabled-horizontal:active {
        background-position: -207px -144px;
        cursor: default;
    }

/* slideshow view all thumbnails */

.slideshow-viewall-container {
    background: #fff;
    border: 1px solid #cacaca;
    border-width: 0 1px;
    bottom: 24px;
    color: #000;
    left: -9999px;
    margin-left: 0;
    padding-top: 39px; /* for close button */
    position: absolute;
    z-index: 10011;
}

    .slideshow-viewall-close {
        background: url(i/slide/slideshow-nav.gif) no-repeat 0 -144px;
        cursor: pointer;
        height: 19px;
        position: absolute;
        right: 10px;
        text-indent: -9999px;
        top: 10px;
        width: 51px;
        z-index: 10012;
    }

        .slideshow-viewall-close:hover {
            background-position: -51px -144px;
        }

    .slideshow-viewall-content {
        height: 557px; /* change */
        overflow: auto;
        width: 588px; /* width of entire player less the borders */
    }

    .slideshow-has-navigation-carousel .slideshow-viewall-content {
        height: 668px; /* change - above height + carousel height */
    }
    /* future different navigation items will need to be accounted for as well, if applicable */

        .slideshow-viewall-container ol {
            list-style: none;
            padding-left: 8px; /* change - per design */
        }

            .slideshow-viewall-container li {
                cursor: pointer;
                float: left;
                _display: inline;
                height: 126px; /* change */
                margin: 10px 0; /* change */
                padding-top: 12px;
                position: relative;
                width: 111px; /* change - entire item, unlike carousel only use the image + border width */
            }

            .slideshow-viewall-container li.active {
                background: url(i/icons/red-arrow-up.gif) no-repeat center bottom;
            }

                .slideshow-viewall-container li img {
                    border: solid #fff;
                    border-width: 5px 4px;
                    height: 101px; /* change - image dimensions */
                    opacity: 0.7;
                    *filter: alpha(opacity=70);
                    width: 101px; /* change - image dimensions */
                }

                .slideshow-navigation-viewall li span {
                    display: block;
                    font-family: arial, sans-serif;
                    font-size: 10px;
                    left: 0;
                    position: absolute; /* for W */
                    top: 0;
                    text-align: center;
                    width: 111px; /* because W is position absolute */
                }

                    .slideshow-navigation-viewall li a {
                        border: 1px solid #fff;
                        display: block;
                        height: 111px; /* change - image dimensions plus padding/border */
                        width: 109px; /* change - image dimensions plus padding/border */
                    }

                    .slideshow-navigation-viewall li.active a {
                        border: 1px solid #7f7f7f; /* change - color */
                    }

                        .slideshow-navigation-viewall li a:hover {
                            border: 1px solid #fff; /* change - color */
                        }

                        .slideshow-navigation-viewall li.active a:hover { /* added for W, may not be necessary elsewhere */
                            border: 1px solid #7f7f7f;
                        }

                        .slideshow-navigation-viewall li a:hover img {
                            opacity: 1;
                            *filter: alpha(opacity=100);
                        }

                        .slideshow-navigation-viewall img {
                            display: block;
                        }

                            .slideshow-navigation-viewall .active img {
                                background: #fff;
                                cursor: default;
                                opacity: 1;
                                *filter: alpha(opacity=100);
                            }

/* slideshow view larger */

.slideshow-view-larger-container {
    background: #fff;
    height: 773px;
    padding-top: 85px;
    position: absolute;
    z-index: 1000001;
}

/* ancillary controls */

.slideshow-view-larger-close {
    background: url(i/slide/slideshow-nav.gif) no-repeat 0 -144px;
    cursor: pointer;
    height: 19px;
    position: absolute;
    right: 84px;
    text-indent: -9999px;
    top: 19px;
    width: 51px;
    z-index: 1000004;
}

    .slideshow-view-larger-close:hover {
        background-position: -51px -144px;
    }

.slideshow-view-larger-instructions-trigger span {
    display: none;
}

.slideshow-view-larger-instructions-close {
    background: url(i/slide/slideshow-nav.gif) no-repeat -297px -144px;
    cursor: pointer;
    height: 14px;
    position: absolute;
    right: 9px;
    text-indent: -9999px;
    top: 9px;
    width: 15px;
    z-index: 1000005;
}

    .slideshow-view-larger-instructions-close:hover {
        background-position: -312px -144px;
    }

.slideshow-view-larger-instructions-trigger {
    background: url(i/slide/slideshow-nav.gif) no-repeat -357px -144px;
    cursor: pointer;
    display: none;
    height: 19px;
    position: absolute;
    right: 144px;
    text-indent: -9999px;
    top: 19px;
    width: 18px;
}

    .slideshow-view-larger-instructions-trigger:hover {
        background-position: -375px -144px;
    }

.slideshow-view-larger-instructions {
    background: #fff;
    border: 1px solid #888;
    color: #000;
    font-size: 10px;
    left: 380px;
    opacity: .8;
    padding: 12px;
    position: absolute;
    text-align: left;
    top: 292px;
    width: 186px;
    z-index: 1000004;
}

    .slideshow-view-larger-instructions strong {
        display: block;
        font-size: 14px;
        margin-bottom: 5px;
    }

.slideshow-view-larger-previous,
.slideshow-view-larger-next {
    background: url(i/slide/slideshow-nav.gif) no-repeat;
    cursor: pointer;
    width: 25px;
    height: 34px;
    position: absolute;
    top: 392px;
}

.slideshow-view-larger-previous {
    background-position: 0 -216px;
    left: 48px;
}

    .slideshow-view-larger-previous:hover {
        background-position: -25px -216px;
    }

.slideshow-view-larger-next {
    background-position: -100px -216px;
    right: 48px;
}

    .slideshow-view-larger-next:hover {
        background-position: -125px -216px;
    }

/* layout */

.slideshow-view-larger-container .items {
    border: 1px solid #cacaca;
    border-width: 0 1px 1px 1px;
    height: 716px;
    left: 79px;
    margin: 0;
    padding: 0;
    position: absolute;
    top: 85px;
    width: 830px;
}

body .slideshow-view-larger-container .items {
    _width: 830px;
}

    .slideshow-view-larger-container .item {
        float: none;
        height: auto;
        left: 0;
        margin: 0;
        position: absolute;
        top: 0;
    }

        .slideshow-view-larger-container .item .captioned-photo {
            border: 0;
            display: table;
            *display: block;
            float: none;
            left: 0;
            margin: 0;
            position: absolute;
            top: 0;
        }

            .slideshow-view-larger-container .w {
                display: table-cell;
                *display: block;
                vertical-align: middle;
            }

            .slideshow-view-larger-container .captioned-photo img {
                display: block;
                float: none;
                margin: 0 auto;
            }

            .slideshow-view-larger-container .caption {
                position: absolute;
                left: 0;
            }

        .slideshow-view-larger-container .item-text {
            color: #333;
            float: none; /* ie6 needs this - absolute next to float bug */
            font-size: 80%;
        }

    .slideshow-view-larger-container .item-inner {
        background: #fff;
        border: 0;
        margin-top: 0; /* overriding the item page here */
        padding: 0 15px;
    }

        .slideshow-view-larger-container .content-headline {
            font: bold 20px "trebuchet ms", corbel, "lucida grande", sans-serif;
        }

        .slideshow-view-larger-container .sub-header {
            font: normal 13px/1.25em "trebuchet ms", corbel, "lucida grande", sans-serif;
        }

    .slideshow-view-larger-container .itemA {
        padding: 627px 0 0 0;
        width: 830px;
    }

        .slideshow-view-larger-container .itemA .item-inner {
            height: 89px;
            width: 800px;
        }

        .slideshow-view-larger-container .itemA .captioned-photo {
            border-bottom: 1px solid #cacaca;
            height: 626px;
            width: 830px;
        }

            .slideshow-view-larger-container .itemA .captioned-photo .caption {
                width: 810px;
                bottom: 122px;
            }

        .slideshow-view-larger-container .itemA .item-text {
        }

    .slideshow-view-larger-container .itemB {
        height: 716px;
        padding: 0 0 0 531px;
        width: 299px;
    }

        .slideshow-view-larger-container .itemB .item-inner {
            height: 716px;
            width: 269px;
        }

        .slideshow-view-larger-container .itemB .captioned-photo {
            border-right: 1px solid #cacaca;
            height: 716px;
            width: 530px;
        }

            .slideshow-view-larger-container .itemB .captioned-photo .caption {
                bottom: 0;
                width: 588px;
            }

        .slideshow-view-larger-container .itemB .item-text {
        }

/* typography */

.slideshow-view-larger-container h1 {
    left: 79px;
    padding: 0 104px 0 0;
    position: absolute;
    top: 21px;
    width: 800px;
}

/* overlay */

.slideshow-view-larger-overlay {
    background: #000;
    left: 0;
    position: absolute;
    opacity: .8;
    *filter: alpha(opacity=80);
    top: 0;
    z-index: 1000000; /* this is insane but necessary to place it above 3rd party ads setting themselves to 999999 */
}

/* controls */

.slideshow-view-larger-util {
    background: url(i/slide/slideshow-nav.gif) repeat-x center top;
    border: 0;
    position: absolute;
    top: 61px;
    left: 79px;
    width: 832px;
    height: 24px;
}

.slideshow-view-larger-util .slideshow-control-forward,
.slideshow-view-larger-util .slideshow-control-backward,
.slideshow-view-larger-util .slideshow-control-play,
.slideshow-view-larger-util .slideshow-control-stop {
    background: url(i/slide/slideshow-nav.gif);
    cursor: pointer;
    height: 24px;
    text-indent: -9999px;
}

    .slideshow-view-larger-util .slideshow-control-forward {
        background-position: -535px -48px;
        width: 55px;
        position: absolute;
        top: 0;
        right: 0;
    }

        .slideshow-view-larger-util .slideshow-control-forward:hover {
            background-position: -535px -72px;
        }

    .slideshow-view-larger-util .slideshow-control-backward {
        background-position: -398px -48px;
        width: 77px;
        position: absolute;
        top: 0;
        right: 112px;
    }

        .slideshow-view-larger-util .slideshow-control-backward:hover {
            background-position: -398px -72px;
        }

    .slideshow-view-larger-util .slideshow-control-play,
    .slideshow-view-larger-util .slideshow-control-stop {
        position: absolute;
    }

    .slideshow-view-larger-util .slideshow-control-play {
        background-position: 0 -48px;
        width: 52px;
        top: 0;
        left: 0;
    }

        .slideshow-view-larger-util .slideshow-control-play:hover {
            background-position: 0 -72px;
        }

    .slideshow-view-larger-util .slideshow-control-stop {
        background-position: -260px -48px;
        display: none;
        width: 60px;
        top: 0;
        left: 0;
    }

        .slideshow-view-larger-util .slideshow-control-stop:hover {
            background-position: -260px -72px;
        }


.slideshow-view-larger-container .slideshow-play-slider-container {
    position: absolute;
    border: 0;
    color: #eee;
    top: 0;
    left: 61px;
    z-index: 1000006;
}

    .slideshow-view-larger-container .slideshow-play-time {
        color: #111;
        font: normal 9px arial, helvetica, sans-serif;
    }

.slideshow-view-larger-container .count {
    color: #111;
    font: normal 9px arial, helvetica, sans-serif;
    line-height: 24px;
    position: absolute;
    right: 55px;
    text-align: center;
    text-indent: 0;
    top: 0;
    width: 57px;
}

/* slider */

.slideshow-play-slider-container {
    background: #000 url(i/slide/slideshow-nav.gif) no-repeat 100% -168px;
    float: left;
    height: 24px;
    padding: 0 70px 0 7px;
    position: relative;
}

    #show-footer .slideshow-play-slider-container {
        background-position: 100% -192px;
    }

    .slideshow-play-slider {
        width: 65px;
    }

    .slideshow-play-time {
        color: #777;
        font-family: arial, sans-serif;
        font-size: 10px;
        line-height: 24px;
        position: absolute;
        right: 8px;
        text-indent: 0;
    }

.slideshow-play-slider-container .ui-slider {
    background: #777;
    border: 0;
    height: 3px;
    margin: 0;
    padding: 0;
    position: relative;
    text-decoration: none;
    top: 10px;
    width: 65px;
}

    /* bad markup, ie blows the container div above out beyond the 3px height b/c of the link inside */
    /* TODO: see if this is still necessary with the new 1.6 slider */
    .slideshow-play-slider-container.ui-slider a {
        _height: 1%;
        _zoom: 1;
    }

.slideshow-play-slider-container .ui-slider-handle {
    background: url(i/slide/slideshow-nav.gif) no-repeat -429px -144px;
    display: block;
    height: 11px;
    margin-left: -5px;
    padding: 0;
    position: absolute;
    text-decoration: none;
    top: -3px;
    width: 10px;
    z-index: 2;
    _overflow: hidden; /* otherwise blows out in ie6 */
}

.slideshow-play-slider-container .ui-slider-handle:hover {

}

.slideshow-play-slider-container .ui-slider-handle-active,
.slideshow-play-slider-container .ui-slider-handle-active:hover {

}


/* CONSUMER MARKETING */

#slideshow-cm-container {
    display: none;
    position: relative;
    height: 550px;
    width: 588px;
}

    #slideshow-cm-extra {
        width: 250px;
        border: 0;
        height: 550px;
        padding: 0;
        position: absolute;
        top: 0;
        right: 0;
    }

        #slideshow-cm-sharing {
            float: left;
            padding: 0 0 10px 0;
            position: relative;
        }

        #slideshow-cm-feature {
            padding-left: 0;
        }

    #slideshow-cm-subsoffer {
        background: #f6f6f6;
        position: absolute;
        top: 0;
        left: 0;
        width: 338px;
        height: 550px;
    }

        #global_slideshow {
            left: 34px;
            position: absolute;
            top: 29px;
            width: 269px;
        }

.slideshow-view-larger-container #slideshow-cm-container {
    background: #cacaca;
    height: 571px;
    padding: 73px 121px 72px 121px;
}

    .slideshow-view-larger-container #slideshow-cm-extra {
        background: #fff;
        float: right;
        height: 550px;
        position: static;
    }

    .slideshow-view-larger-container #slideshow-cm-subsoffer {
        float: left;
        position: static;
        height: 550px;
    }

        .slideshow-view-larger-container #global_slideshow {
            top: 104px;
            left: 156px;
        }

/* cm utils - note some of these styles are to override the defaults in global.css for regular utility links */

#slideshow-cm-sharing ul.utilities {
    background: #fff;
    border: 0;
    border-bottom: 1px solid #cacaca;
    float: left;
    _display: inline;
    height: 42px;
    margin: 24px 0 0 0;
    padding: 0 0 40px 0;
    width: 250px;
    clear: both;
    display: block;
}

    #slideshow-cm-sharing ul.utilities li {
        background: none;
        display: block;
        float: left;
        _display: inline;
        height: 32px;
        list-style: none;
        margin: 0 0 10px 0;
        padding: 0;
        width: 250px;
    }

        #slideshow-cm-sharing ul.utilities li a {
            background: #fff url(i/slide/slideshow-shareicons.gif) no-repeat;
            border-right: 0;
            color: #555;
            display: block;
            float: none;
            height: 32px;
            left: 75px;
            padding: 0;
            position: relative;
            text-indent: -9999px;
        }

            #slideshow-cm-sharing ul.utilities li.utility-email a {
                background-position: 0 0;
                width: 98px;
            }

                #slideshow-cm-sharing ul.utilities li.utility-email a:hover {
                    background-position: 0 -32px;
                }

            #slideshow-cm-sharing ul.utilities li.utility-share a {
                background-position: -100px 0;
                width: 99px;
            }

                #slideshow-cm-sharing ul.utilities li.utility-share a:hover {
                    background-position: -100px -32px;
                }

.slideshow-replay {
    bottom: 26px;
    height: 32px;
    position: absolute;
    left: 75px;
    width: 100px;
}

    .slideshow-replay a {
        background: url(i/slide/slideshow-shareicons.gif) no-repeat right top;
        display: block;
        height: 32px;
        left: 0;
        position: absolute;
        text-indent: -9999px;
        top: 0;
        width: 100px;
    }

        .slideshow-replay a:hover {
            background-position: right bottom;
        }

#slideshow-cm-replay {
    display: block;
}

    .slideshow-view-larger-container #slideshow-cm-replay {
        display: none;
    }

#slideshow-cm-replay-larger {
    display: none;
}

    .slideshow-view-larger-container #slideshow-cm-replay-larger {
        display: block;
    }

/* OLD STYLES */
.list .related-links{list-style-type:none;}
.keywords{width:290px;margin-bottom:10px;}
.bottom-links .feature .blurb .keywords{display:none;}

/* Adding hover style to all links appearing in content area */
.list a {
    text-decoration:none; border-bottom:1px dotted #bbbbbb;
    }

.headers .byline {
    font:bold 11px "trebuchet ms",corbel,"lucida grande",sans-serif;
}