/***************************************************************
 * alpo-icons.css defines the sprites for the images in the site
 * To update colors, please see alpo-default-color.css
 * To update the structure, please see alpo.css
 * For a reference sheet of all the sprites,
 * see http://repo/svn/veoh/Design/Prototypes 08/StyleGuide/spriteReference.html
 ***************************************************************/
.icon, .graphic, .button { display: block; background: transparent url(../images/veoh_sprite.gif) no-repeat 0px 0px; }
.icon { line-height: 1px; font-size: 1px; }
.icon:hover, .graphic:hover, .button:hover { text-decoration: none; }

    /* icons/graphics that have a span tag that need an image get listed with defaults here */
    .button span, .sp_expandableBar h2 { display: block; background: transparent url(../images/veoh_sprite.gif) no-repeat 0px 0px; float: left; white-space: nowrap;}

.sp_searchEnd {
    width: 6px; height: 32px;
    background-position: 0px -28px;
}

a.sp_scroll-left-white, a.sp_scroll-right-white, a.sp_scroll-left-black, a.sp_scroll-right-black,
a.sp_scroll-left-white-disabled, a.sp_scroll-right-white-disabled, a.sp_scroll-left-black-disabled, a.sp_scroll-right-black-disabled{
    width: 20px; height: 16px;
}
a.sp_scroll-left-white { background-position: -105px -44px; }
a.sp_scroll-right-white { background-position: -125px -44px; }
a.sp_scroll-left-black { background-position: -146px -44px; }
a.sp_scroll-right-black { background-position: -166px -44px; }
a.sp_scroll-left-white:active, a.sp_scroll-left-white-disabled { background-position: -105px -28px; }
a.sp_scroll-right-white:active, a.sp_scroll-right-white-disabled { background-position: -125px -28px; }
a.sp_scroll-left-black:active, a.sp_scroll-left-black-disabled { background-position: -146px -28px; }
a.sp_scroll-right-black:active, a.sp_scroll-right-black-disabled { background-position: -166px -28px; }
a.sp_scroll-left-white-disabled, a.sp_scroll-right-white-disabled, a.sp_scroll-left-black-disabled, a.sp_scroll-right-black-disabled { cursor: default; }

.sp_searchClear, .sp_searchClear:hover, .sp_searchClear:visited, .sp_searchClear:active {
    width: 14px; height: 14px;
    background-position: -73px 0px;
}
    .sp_searchClear:hover {
        background-position: -73px -14px;
    }

.sp_home, .sp_home:visited {
    width: 12px; height: 10px;
    background-position: -88px -3px;
}
    .sp_home:hover { background-position: -101px -3px; }

.sp_info {
    width: 15px; height: 13px;
    background-position: -109px -14px;
}

.sp_addQueue {
    width: 15px; height: 13px;
    background-position: -125px -14px;
}

.sp_edit, sp_edit:visited {
    width: 14px; height: 12px;
    background-position: -114px -1px;
}
    .sp_edit:hover { background-position: -129px -1px; }

.sp_searchButton, .sp_searchButton:visited {
    width: 32px; height: 32px;
    background-position: -7px -28px;
}
    .sp_searchButton:hover { background-position: -40px -28px; }
    .sp_searchButton:active { background-position: -73px -28px; }

.sp_18plus {
    width: 20px; height: 13px;
    background-position: -88px -14px;
}

.sp_star-whole-blue, .sp_star-whole-green, .sp_star-whole-grey {
    margin-right: 1px;
    width: 11px; height: 11px;
    float: left;
}
.sp_star-whole-blue { background-position: -150px -1px; }
.sp_star-whole-green { background-position: -162px -1px; }
.sp_star-whole-grey { background-position: -174px -1px; }

.sp_arrow-right-black { width: 6px; height: 7px; background-position: -150px -13px; }
.sp_arrow-down-black { width: 7px; height: 6px; background-position: -150px -21px; }
.sp_arrow-right-white { width: 6px; height: 7px; background-position: -174px -13px; }
.sp_arrow-down-white { width: 7px; height: 6px; background-position: -174px -21px; }
.sp_arrow-right-blue { width: 6px; height: 7px; background-position: -158px -13px; }
.sp_arrow-down-blue { width: 7px; height: 6px; background-position: -158px -21px; }
.sp_arrow-up-blue { width: 7px; height: 6px; background-position: -142px -21px; }
.sp_arrow-right-grey { width: 6px; height: 7px; background-position: -166px -13px; }
.sp_arrow-down-grey { width: 7px; height: 6px; background-position: -166px -21px; }
.sp_arrow-up-grey { width: 7px; height: 6px; background-position: -142px -14px; }

.sp_sendToFriend, .sp_sendToFriend:visited, .sp_sendToFriend:active {
    width: 27px; height: 20px;
    background-position: -186px 0px;
}
    .sp_sendToFriend:hover { background-position: -213px 0px; }

.sp_myspace, .sp_myspace:visited, .sp_myspace:active {
    width: 27px; height: 20px;
    background-position: -186px -20px;
}
    .sp_myspace:hover { background-position: -213px -20px; }

.sp_flagItem, .sp_flagItem:visited, .sp_flagItem:active {
    width: 27px; height: 20px;
    background-position: -186px -40px;
}
    .sp_flagItem:hover { background-position: -213px -40px; }

.sp_facebook, .sp_facebook:visited, .sp_facebook:active {
    width: 27px; height: 20px;
    background-position: -240px 0px;
}
    .sp_facebook:hover { background-position: -267px 0px; }

.sp_twitter, .sp_twitter:visited, .sp_twitter:active {
    width: 27px; height: 20px;
    background-position: -240px -20px;
}
    .sp_twitter:hover { background-position: -267px -20px; }

.sp_embed, .sp_embed:visited, .sp_embed:active {
    width: 27px; height: 20px;
    background-position: -240px -40px;
}
    .sp_embed:hover { background-position: -267px -40px; }

.sp_addVideo, .sp_addVideo:visited, .sp_addVideo:active {
    width: 27px; height: 20px;
    background-position: -294px 0px;
}
    .sp_addVideo:hover { background-position: -321px 0px; }

.sp_groupInvite, .sp_groupInvite:visited, .sp_groupInvite:active {
    width: 27px; height: 20px;
    background-position: -510px -20px;
}
    .sp_groupInvite:hover { background-position: -537px -20px; }

.sp_digg, .sp_digg:visited, .sp_digg:active {
    width: 27px; height: 20px;
    background-position: -294px -20px;
}
    .sp_digg:hover { background-position: -321px -20px; }

.sp_delicious, .sp_delicious:visited, .sp_delicious:active {
    width: 27px; height: 20px;
    background-position: -294px -40px;
}
    .sp_delicious:hover { background-position: -321px -40px; }

.sp_download-black, .sp_download-black:visited, .sp_download-black:active {
    width: 27px; height: 20px;
    background-position: -348px 0px;
}
    .sp_download-black:hover { background-position: -375px 0px; }

.sp_download-blue, .sp_download-blue:visited, .sp_download-blue:active {
    width: 27px; height: 20px;
    background-position: -348px -20px;
}
    .sp_download-blue:hover { background-position: -375px -20px; }

.sp_stumbleupon, .sp_stumbleupon:visited, .sp_stumbleupon:active {
    width: 27px; height: 20px;
    background-position: -348px -40px;
}
    .sp_stumbleupon:hover { background-position: -375px -40px; }

.sp_removeInterest {
    width: 38px; height: 7px;
    background-position: -402px 0px;
}

.sp_updated-green {
    width: 7px; height: 7px;
    background-position: -441px 0px;
}

.sp_updated-orange {
    width: 7px; height: 7px;
    background-position: -449px 0px;
}

.sp_close {
    width: 14px; height: 13px;
    background-position: -442px -7px;
}

.sp_leaveGroup, .sp_leaveGroup:active, .sp_leaveGroup:visited {
    width:27px; height:20px;
    background-position:-456px -20px;
}
    .sp_leaveGroup:hover {
        background-position:-483px -20px;
    }

.sp_publish, .sp_publish:visited, .sp_publish:active {
    width: 20px; height: 13px;
    background-position: -402px -7px;
}
    .sp_publish:hover { background-position: -422px -7px; }

.sp_addInterest, .sp_addInterest:visited, .sp_addInterest:active {
    width: 27px; height: 20px;
    background-position: -402px -20px;
}
    .sp_addInterest:hover { background-position: -429px -20px; }

.sp_addInterest-bold, .sp_addInterest-bold:visited, .sp_addInterest-bold:active {
    width: 27px; height: 20px;
    background-position: -510px 0px;
}
    .sp_addInterest-bold:hover { background-position: -537px 0px; }

.sp_joinGroup, .sp_joinGroup:active, .sp_joinGroup:visited {
    width:27px; height:20px;
    background-position:-456px 0px;
}
    .sp_joinGroup:hover {
        background-position:-483px 0px;
    }

.sp_ipod, .sp_ipod:visited, .sp_ipod:active {
    width: 27px; height: 20px;
    background-position: -402px -40px;
}
    .sp_ipod:hover { background-position: -429px -40px; }

.sp_fav, .sp_fav:visited, .sp_fav:active {
    width: 27px; height: 20px;
    background-position: -456px -40px;
}
    .sp_fav:hover, .sp_fav.added, .sp_fav.added:hover { background-position: -483px -40px; }
    .sp_fav.added, .sp_fav.added:hover { opacity: 0.5; cursor: default; }

a.sp_fullScreen, a.sp_fullScreen:visited, a.sp_fullScreen:active {
    width: 27px; height: 20px;
    background-position: -510px -40px;
}
    a.sp_fullScreen:hover { background-position: -537px -40px; }

a.sp_closeWatch, a.sp_closeWatch:visited, a.sp_closeWatch:active {
    width: 27px; height: 20px;
    background-position: -564px -40px;
}
    a.sp_closeWatch:hover { background-position: -591px -40px; }

.sp_addGroup, .sp_addGroup:visited, .sp_addGroup:active {
    width: 27px; height: 20px;
    background-position: -402px -20px;
}
    .sp_addGroup:hover, .sp_addGroup.added, .sp_addGroup.added:hover { background-position: -429px -20px; }
    .sp_addGroup.added, .sp_addGroup.added:hover { opacity: 0.5; cursor: default; }

.button {
    padding: 0px 8px 0px 0px;
    height: 20px;
    text-align: center;
    vertical-align: middle;
}
    .button span {
        margin: 0px -16px 0px 8px;
        padding: 3px 8px 0px 0px;
        height: 17px;
        white-space: nowrap;
        cursor: pointer;
    }
.buttonSpaceFix {
    margin-right: 8px;
}

.sp_button-blue, .sp_button-blue:visited, .sp_button-blue:hover, .sp_button-blue:active {
    color: #fff;
    background-position: left -60px;
}
    .sp_button-blue span, .sp_button-blue:visited span { background-position: right -60px; }
    .sp_button-blue:hover { background-position: left -80px; }
    .sp_button-blue:hover span { background-position: right -80px; }
    .sp_button-blue:active { background-position: left -100px; }
    .sp_button-blue:active span { background-position: right -100px; }

.sp_button-green, .sp_button-green:visited, .sp_button-green:hover, .sp_button-green:active {
    color: #fff;
    background-position: left -120px;
}
    .sp_button-green span, .sp_button-green:visited span { background-position: right -120px; }
    .sp_button-green:hover { background-position: left -140px; }
    .sp_button-green:hover span { background-position: right -140px; }
    .sp_button-green:active { background-position: left -160px; }
    .sp_button-green:active span { background-position: right -160px; }

.sp_button-orange, .sp_button-orange:visited, .sp_button-orange:hover, .sp_button-orange:active,
li.sp_button-orange, li.sp_button-orange:hover, div.sp_button-orange, div.sp_button-orange:hover {
    color: #fff;
    background-position: left -180px;
    font-weight: bold;
}
    li.sp_button-orange, li.sp_button-orange:hover, div.sp_button-orange, div.sp_button-orange:hover {
        color: #FFD9BF;
    }
    .sp_button-orange span, .sp_button-orange:visited span,
    li.sp_button-orange span, li.sp_button-orange:visited span,
    div.sp_button-orange span, div.sp_button-orange:visited span,
    li.sp_button-orange:hover span,	div.sp_button-orange:hover span { background-position: right -180px; }
    .sp_button-orange:hover { background-position: left -200px; }
    .sp_button-orange:hover span { background-position: right -200px; }
    .sp_button-orange:active { background-position: left -220px; }
    .sp_button-orange:active span { background-position: right -220px; }
    li.sp_button-orange:hover, div.sp_button-orange:hover,
    li.sp_button-orange:hover span, div.sp_button-orange:hover span { cursor: default; }

.sp_button-white, .sp_button-white:visited, .sp_button-white:hover,
li.sp_button-white, li.sp_button-white:hover, div.sp_button-white, div.sp_button-white:hover,
span.sp_button-white, span.sp_button-white:hover {
    color: #0054a6;
    background-position: left -240px;
}
.sp_button-white.toggle, .sp_button-white.toggle:active, .sp_button-white.toggle:visited {
    padding-right: 0;
    background-position: center -240px;
    font-weight: normal;
}
    .sp_button-white.toggle:hover { background-position: center -260px; }
    .sp_button-white.toggle.selected, .sp_button-white.toggle.selected:visited, .sp_button-white.toggle.selected:hover,
    .sp_button-white.toggle:active, .sp_button-white.toggle.right:active {
        background-position: center -280px;
    }
    .sp_button-white.toggle span { margin-right: 0px; padding-right: 8px; background: 0; border-right: 1px solid #b5b5b5; }
.sp_button-white.toggle.left {
    background-position: left -240px;
}
    .sp_button-white span, .sp_button-white:visited span, .sp_button-white:hover span,
    li.sp_button-white span, li.sp_button-white:hover span, div.sp_button-white span, div.sp_button-white:hover span,
    span.sp_button-white span, span.sp_button-white:hover span {
        background-position: right -240px;
    }
    .sp_button-white.toggle.right span, .sp_button-white.toggle.right:visited span, .sp_button-white.toggle.right:hover span {
        margin:0px -16px 0px 8px;
        padding:3px 8px 0px 0px;
        border-right: 0;
        background: transparent url(../images/veoh_sprite.gif) no-repeat right -240px;
    }
    li.sp_button-white, li.sp_button-white:hover, div.sp_button-white, div.sp_button-white:hover,
    span.sp_button-white, span.sp_button-white:hover,
    li.sp_button-white span, li.sp_button-white:hover span, div.sp_button-white span, div.sp_button-white:hover span,
    span.sp_button-white span, span.sp_button-white:hover span {
        color: #888888;
        font-weight: bold;
        cursor: default;
    }
    .sp_button-white:hover, .sp_button-white.toggle.left:hover { background-position: left -260px; }
    .sp_button-white:hover span, .sp_button-white.toggle.right:hover span { background-position: right -260px; }

    .sp_button-white:active, .sp_button-white.selected, .sp_button-white.selected:hover,
    .sp_button-white.toggle.left:active,
    .sp_button-white.toggle.left.selected, .sp_button-white.toggle.left.selected:active,
    .sp_button-white.toggle.left.selected:hover { background-position: left -280px; color: #fff;}

    .sp_button-white:active span, .sp_button-white.toggle.right:active span,
    .sp_button-white.selected span, .sp_button-white.selected:hover span,
    .sp_button-white.toggle.right.selected span { color: #fff; background-position: right -280px; }

.sp_navbar, .sp_navbar-right {
    width: 969px; height: 30px;
    background-position: left -300px;
    background-repeat: repeat-x;
    float: none;
    clear: both;
}
    .sp_navbar-right { margin-left: 1px; margin-right: -1px; background-position: right -300px; } /* for the rounded corner on the right */

.sp_tab,
.sp_tab:visited,
.sp_tab:hover,
.sp_tab:active
{
    padding: 5px 10px 0px 10px;
    height: 25px;
    text-align: center;
    color: #fff;
    vertical-align: bottom;
    font-size: 1.1em;
}

li .sp_tab { background-position: -1px -300px; }
li:hover .sp_tab { background-position: 0px -330px; }
li.selected .sp_tab { background-position: 0px -360px; }

.sp_tab-arrow {
	height: 16px;
	width: 17px;
}

li .sp_tab-arrow { background-position: -564px -24px; }
li .sp_tab-arrow:hover { background-position: -581px -24px; }
li.selected .sp_tab-arrow { background-position: -615px -24px; }
li.selected .sp_tab-arrow:hover { background-position: -598px -24px; }

.sp_pageSubBar {	/* browse sub bar */
    margin-right: 1px;
    padding-right: 8px;
    height: 41px;
    background-position: left -415px;
    float: none;
}
    .sp_pageSubBarInner {
        margin: 0px -9px 0px 8px;
        padding: 10px 8px 0 0;
        height: 31px;
        white-space: nowrap;
        background-position: right -415px;
    }

.sp_featuredBar {
    width: 100%; height: 100px;
    background-position: 0px -546px;
    background-repeat: repeat-x;
    float: none;
}
.sp_header {
    height: 60px;
    background-position: 0px -486px;
    background-repeat: repeat-x;
}
.sp_header_qlipso {
    height: 20px;
    background-position: 0px -486px;
    background-repeat: repeat-x;
}

.sp_expandableBar {
    width: 100%; height: 30px;
    background-position: 0px -456px;
    float: none;
    position: relative;
    cursor: pointer;
}
    .sp_expandableBar .icon {
        position: absolute;
        top: 12px; left: 10px;
    }
    .sp_expandableBar h2 {
        margin: 0px -2px 0px 25px;
        padding: 5px 0px 0px 0px;
        height: 25px;
        background-position: right -456px;
        float: none;
        cursor: pointer;
    }

.sp_pageSubBar-reverse {	/* reverse subtle gradient bar, used in watchpane */
    margin-right: 5px;
    padding-right: 8px;
    height: 25px;
    background-position: left -390px;
    float: none;
}
    .sp_pageSubBar-reverseInner {
        margin: 0px -12px 0px 8px;
        padding: 0 8px 0 0;
        height: 25px;
        background-position: right -390px;
        float: none;
    }

.sp_progressBarOuter {
    margin: 0px 2px 0px 0px;
    width: auto; height: 19px;
    float: none;
    background-position: left -661px;
}
    .sp_progressBarOuter-2 {	/* necessary for the rounded end on the right */
        margin: 0px -2px 0px 2px;
        width: auto; height: 19px;
        background-position: right -661px;
    }
.sp_progressBarLeft {
    margin: 2px 2px 0px 0px;
    height: 15px;
    float: left;
    background-position: left -646px;
}
.sp_progressBarRight {	/* This is the piece that actually widens and fills in progress */
    margin: 0px -2px 0px 2px;
    height: 15px;
    float: left;
    background-position: right -646px;
}

.sp_progressBarPercent {
    text-align: center;
    color: #fff;
    font-weight: bold;
}