/* ---------- basic definitions ---------- */
html, body { margin:0; padding:0; color: white;font-family:Trebuchet MS,Arial,Helvetica,sans-serif; color:#525252;}
a, a:link, a:visited, a:active, a:hover { text-decoration: none; color:#a9a9a9; outline: 0; }
a:hover { color:white; }
img { border: none; }
.corporateRed {color:#E3213C;}
.corporateBlue {color:#183A8C;}
.clear { clear: both; }
.inlineBlock { display: -moz-inline-box; display: inline-block; }
+ html .inlineBlock {display: inline;} /* for IE6 */
*+ html .inlineBlock {display: inline;} /* for IE6 */
.weiss {color:white;}
.grau_1 {color:#d3d3d3;}
.grau_2 {color:#a9a9a9;}
.grau_3 {color:#696969;}
.grau_4 {color:#3b3b3b;}

.hoverCheckParent .hoverCheck { position: absolute; width: 0px; height: 0px; left: 0px; visibility: hidden; }
.hoverCheckParent:hover .hoverCheck { left: 1px; visibility: visible;}


/* ========== site definitions ========== */
body {
    background: black;
    background: silver;
    background: #1c1c1c;
    background: #141414;
}

/* ========== Wrapper ========== */
#outerWrapper.tcWrapper {
    background: #141414 url(/images/main/background_page.png) center top repeat;
}

#overallWrapper {
    background: black url(/images/main/top_background_1.png) center top repeat-x;
    width: auto;
    margin: auto;
    position: static;
}
    .withAd #overallWrapper {
        background: url(/images/main/shadow-left.png) top left repeat-y;
        padding-left: 6px;
        width: 1102px;
        margin: 0 auto;
    }

#middleWrapper_A {
    padding-right: 4px;
}
#middleWrapper_B {
    background: url(/images/main/shadow-right.png) top right repeat-y;
}

#MainWrapper {
    width: 932px;
    margin: 0 auto;
    overflow: hidden;
}
    .withAd #MainWrapper {
        margin: 0;
        background: black;
    }

#Banner, #Scyscraper { display: none; }
.withAd #Banner, .withAd #Scyscraper { display: block }

#Banner {
    height: 60px;
    width: 942px;
}
    #Banner iframe {
        /*margin-right: 3px;*/
    }
#Scyscraper {
    height: 600px;
    width: 160px;
}
/* ========== HEADER ========== */

#HEADER {
    /*border: 1px solid #1c1c1c;*/
    position: relative;
    height: 62px;
    z-index: 1000;
    border: 0px solid #303030;
    border-width: 0 1px;
    overflow: none;
}
    .withAd #HEADER {
        background: black url(/images/main/top_background_1.png) center top repeat-x;
    }
    #PERSONALBAR {
        font-size: 10px;
        text-align: center;
    }

        #HEADER #PERSONALBAR {
            position: absolute;
            left: 479px;
            width: 291px;
            top: 0px;
            border: 0px solid #303030;
            border-width: 0 1px;
            background: none;
            background: url(/images/main/top_background_2.png) center top repeat-x;
            padding-top: 7px;
            height:55px;
        }
        #HEADER #PERSONALBAR .iconButton span.newItems {
            left: 34px;
        }
        #HEADER #PERSONALBAR .iconButton,
        #HEADER #PERSONALBAR .iconButton .wrapper {
            width: 55px;
        }
            #HEADER #PERSONALBAR .iconButton .caption {
                margin-top: 2px;
            }


    #LOGO {
        width: 133px;
        height: 51px;
        position: absolute;
        background: url(/images/main/logo_small.png) no-repeat top left;
        left: 25px;
        top: 6px;
    }
    * html #LOGO {
        background: none;
        filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod=scale, src='/images/main/logo.png');
    }

    /* ---------- SearchBox ------------- */
    #SearchBox {
        position: absolute;
        top: 0px;
        right: 0px;
        /*vertical-align: middle;*/
        background: url(/images/main/top_background_2.png) center top repeat-x;
        height:48px;
        width: 140px;
        padding: 0 10px;
        padding-top: 14px;
        overflow: hidden;
        /*border: 1px solid yellow;*/
        /*z-index: 100;*/
    }

        #SearchBox .dropdownbox {
            position: absolute;
            top: 0px;
            left: 0px;
        }
        #SearchBox .inputOkBox {
            /*position: absolute;*/
            /*top: 0px;*/
            /*right: 0px;*/
        }

	    #JsLoadLoginStatus {
		margin: 10px 0 0 0;
		text-align: left;
		font-size: 10px;
		clear: both;
		position: absolute;
		bottom: 6px; 
		width: 140px; 
	    }

            #SearchBox .inputOkBox .inputOk_input {
                /*width: 125px;*/
                width: 85px;
            }
    
    /* ---------- loginbox ------------- */
    #loginbox {
        float: right;
        height:40px;
        overflow: hidden;
        white-space: nowrap;
    }

    #loginbox a,
    #loginbox a:link,
    #loginbox a:visited,
    #loginbox a:active,
    #loginbox a:hover, 
    #loginbox .screenname {
        font-size:10px;
        color: white;
    }

    /* ---------- MenuBox ------------- */
    #MenuBox {
        position: absolute;
        left: 198px;
        top: 5px;
    }

        #MainMenu {
            margin:0;
            padding:0;
            /*border: 1px solid pink;*/
        }
            #MainMenu li {
                margin:0;
                padding:0;
                display: block;
                float: left;
                width: 70px;
            }
            
            #MainMenu li.MainMenuListing {
                position: relative;
                text-align: center;
                font-size: 16px;
                font-weight:bold;
                height: 40px;
                

                /*border: 1px solid red;*/
            }
            
            #MainMenu>li.active {
                background: url(/images/main/fog.png) center center no-repeat;
            }
            * html #MainMenu li.MainMenuListing {
                /*filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod=scale, src='/images/main/fog.png');*/
            }

                #MainMenu li a {
                    color:#a9a9a9;
                }
                
                #MainMenu li:hover a, 
                #MainMenu li.active span {
                    color:white;
                    
                }

                #MainMenu li span.subPos {
                    top: 12px;
                    position: relative;
                    height: 20px;
                }

        #SubMenu {
            margin:0;
            padding:0;
            position: absolute;
            left: 0px;
            top: 26px;
            width: 700px;
        }
            #SubMenu li.SubMenuListing {
                text-align: left;
                height: 20px;
                font-size: 11px;
                width: auto;
                margin-right: 15px;
            }

                #SubMenu li.SubMenuListing a,
                #SubMenu li.SubMenuListing span,
                #MainMenu li:hover #SubMenu li.SubMenuListing a 
                #MainMenu li:hover #SubMenu li.SubMenuListing span {
                    /*color:#525252;*/
                    color: #696969 
                }

                #SubMenu li:hover a,
                #SubMenu li:hover span,
                #MainMenu li:hover #SubMenu li:hover a 
                #MainMenu li:hover #SubMenu li:hover span, 
                #SubMenu li.active a, 
                #SubMenu li.active span {
                    /*color:#D1D0D6;*/
                    color: white;
                }
                #SubMenu li.SubMenuListing span {
                    height: 10px;
                }

/* ========== MAIN ========== */

#MAIN {
    /*margin-top: -5px;*/
    margin-top: 6px;
    margin-bottom: 15px;
}

    #mainCL {
        width: 160px;
        /*padding-top: 11px;*/
        margin-bottom: 15px;
    }

        .sideBoxTitle {
            width: 140px;
            height: 25px;
            line-height: 25px;
            margin: 5px 10px 5px 10px;
            font-size: 20px;
            font-weight: bold;
        }
        .sideBox {
            border: 1px solid #1c1c1c;
            padding: 0;
            margin-bottom:10px;
        }
            .sideBoxTabs {
                padding-left: 10px;
                height: 10px;
                font-size: 10px;
                line-height: 10px;
                vertical-align: middle;
                margin-bottom: 10px;
                /*white-space: nowrap;*/
            }

            .sideBoxTabs a:hover, 
            .sideBoxTabs a.active {
                color:#D1D0D6;
            }
            .sideBoxContent {
                overflow: hidden;
            }

        #tagbox {
            /*padding-bottom:20px;*/
            /*height: 465px;*/
            /*background: url(/images/views/contentbox_backgr.png) top left repeat-x;*/
            min-height: 480px;
        }
            #tagboxContent {
                /*height: 400px;*/
                height: 425px;
                overflow: visible;
            }
            
            #tagboxContent .songBadge {
            }

        #historyBox {
        }
            #historyBoxContent {
                margin-bottom: 0px;
            }
                #historyBoxContent a {
                    display: block;
                    height: 20px;
                    line-height: 20px;
                    vertical-align: middle;
                    font-size: 11px;
                    background: url(/images/main/bar_background.gif) left top repeat-x;
                    white-space: nowrap;
                    margin-bottom: 5px;
                    overflow: hidden;
                    width: 140px;
                }
                #historyBoxContent a img {
                    height: 20px;
                    width: 20px;
                    float: left;
                    margin-right: 5px;
                }

    #mainCR {
        border: 1px solid #1c1c1c;
    }

    #mainCM {
        padding-right: 10px;
    }
    
    #mainContent {
        position: relative;
        overflow: hidden;
    }
    #mainContent > .contentBox {
        min-height: 665px;
    }
        #mainContent .infoBox {
            display: none;
            position: absolute;
            top: 0px;
            z-index: 100;
            overflow: hidden;
        }
            #mainContent .infoBox .left {
                position: absolute;
                left: 0px;
                width: 10px;
                /*top: 0px;*/
                height: 100%;
                bottom: 10px;
            }
            html>body #mainContent .infoBox .left {
                background: url(/images/infobox/box_left.png) left top repeat-y;
            }
            * html #mainContent .infoBox .left {
                background: none;
                margin-bottom: 8px;
                filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod=scale, src='/images/infobox/box_left.png');
            }
            #mainContent .infoBox .right {
                position: absolute;
                right: 0px;
                width: 10px;
                /*top: 0px;*/
                height: 100%;
                bottom: 10px;
            }
            html>body #mainContent .infoBox .right {
                background: url(/images/infobox/box_right.png) right top repeat-y;
            }
            * html #mainContent .infoBox .right {
                background: none;
                margin-bottom: 8px;
                filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod=scale, src='/images/infobox/box_right.png');
            }
            #mainContent .infoBox .content {
                position: relative;
                left: 10px;
                right: 10px;
                bottom: 10px;
            }
            html>body #mainContent .infoBox .content {
                background: url(/images/infobox/box_inner.png) left top repeat;
            }
            * html #mainContent .infoBox .content {
                background: none;
                margin-bottom: 8px;
                filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod=scale, src='/images/infobox/box_inner.png');
            }
                
            #mainContent .infoBox .leftCorner {
                position: absolute;
                bottom: 0px;
                left: 0px;
                height: 10px;
                width: 10px;
            }
            html>body #mainContent .infoBox .leftCorner {
                background: url(/images/infobox/box_corner_left_bottom.png) top left no-repeat;
            }
            * html #mainContent .infoBox .leftCorner {
                background: none;
                filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod=crop, src='/images/infobox/box_corner_left_bottom.png');
            }
                
            #mainContent .infoBox .rightCorner {
                position: absolute;
                bottom: 0px;
                right: 0px;
                height: 10px;
                width: 10px;
            }
            html>body #mainContent .infoBox .rightCorner {
                background: url(/images/infobox/box_corner_right_bottom.png) top left no-repeat;
            }
            * html #mainContent .infoBox .rightCorner {
                background: none;
                filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod=crop, src='/images/infobox/box_corner_right_bottom.png');
            }
                
            #mainContent .infoBox .middle {
                position: absolute;
                bottom: 0px;
                left: 10px;
                right: 10px;
                height: 10px;
            }
            html>body #mainContent .infoBox .middle {
                background: url(/images/infobox/box_bottom.png) top left repeat-x;
            }
            * html #mainContent .infoBox .middle {
                background: none;
                filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod=crop, src='/images/infobox/box_bottom_IE.png');
            }

            #mainContent .infoBox .message {
                padding: 20px 40px;
                padding-top: 40px;
                font-weight: bold;
                color:#D1D0D6;
            }
            #mainContent .infoBox .closeButton {
                width: 16px;
                height: 16px;
                position: absolute;
                bottom: 16px; 
                cursor: pointer;
            }
            html>body #mainContent .infoBox .closeButton {
                background: url(/images/infobox/clickaway.png) center no-repeat;
            }
            * html #mainContent .infoBox .closeButton {
                filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod=crop, src='/images/infobox/clickaway.png');
            }
            #mainContent .infoBox .close1 {
                left: 16px;
            }
            #mainContent .infoBox .close2 {
                right: 16px;
            }
        #MessageBox.infoBox {
            display: block;
            left: 3px;
            width: 99%;
        }
            #MessageBox.infoBox .message {
                text-align: center;
            }
        #LoginMessageBox.infoBox {
            right: 0px;
            width: 500px;
        }
            #LoginMessageBox.infoBox .message {
                text-align: left;
            }
        #NewItemBox.infoBox {
        }



/* ========== FOOTER ========== */

#FOOTER {
    padding: 15px;
    font-size:11px;
    background: #141414;
}

    #FOOTER .footerWrapper {
        width: 932px;
        margin: 0 auto;
    }
    .withAd #FOOTER .footerWrapper {
        width: 1062px;
        padding-left: 46px;
    }

    .footerlinks a,
    .footerlinks a:link,
    .footerlinks a:visited,
    .footerlinks a:active,
    .footerlinks a:hover  {
        margin-right:10px;
        color:white;
        font-weight:normal;
    }

    #FOOTER b {
        margin-right:10px;
    }



/* shoppingCart */
#shoppingCart {
    width: 300px;
}
    #shoppingCartListing {
        margin:0;
        padding:0;
        overflow: scroll;
        overflow-x: hidden;
        overflow-y: scroll;
        height: 200px;
    }
    
        #shoppingCartListing li {
            margin:0;
            padding:0;
            display: block;
            padding-left: 10px;
        }
        #shoppingCartListing li table {
            background: url(/images/songBadge/background.png) bottom right repeat-x;
            width: 100%;
            border-collapse: collapse;
        }
            #shoppingCartListing li table td {
                height: 50px;
            }
                #shoppingCartListing li.overall table td {
                    height: 50px;
                    text-align: right;
                    font-weight: bold;
                    background: #141414;
                    color: white;
                }
                #shoppingCartListing li table td.coverArt {
                    width: 50px;
                }
                    #shoppingCartListing li .coverWrapper {
                        height: 44px;
                        width: 50px;
                        position: relative;
                        left: -10px;
                        float: left;
                    }
                        #shoppingCartListing li .nocover,
                        #shoppingCartListing li .cover {
                            height: 44px;
                            width: 44px;
                            position: absolute;
                            top: 0;
                            right: 0;
                        }
                        #shoppingCartListing li .nocover {
                            width: 50px;
                        }
                        #shoppingCartListing li .coverOverlay {
                            height: 100%;
                            width: 100%;
                            position: absolute;
                            top: 0;
                            right: 0;
                        }
                        #shoppingCartListing li .albumOverlay {
                            background: url(/images/songBadge/album50x44.png) top right no-repeat;
                        }


                #shoppingCartListing li table td.songinfo {
                    color: #D1D0D6;
                    font-size: 11px;
                }
                    #shoppingCartListing li table td.songinfo .artist {
                    }
                    #shoppingCartListing li table td.songinfo .album{
                    }
                    #shoppingCartListing li table td.songinfo .title {
                    }

                #shoppingCartListing li table td.icon {
                    width: 20px;
                    text-align: center;
                    background: url(/images/silk/bin_closed.png) center no-repeat;
                }
                    #shoppingCartListing li table td.icon:hover {
                        background: url(/images/silk/bin.png) center no-repeat;
                    }
                    #shoppingCartListing li table td.icon img {
                        width: 15px;
                        height: 15px;
                    }
                        #shoppingCartListing li table td.icon img:hover {
                            width: 20px;
                            height: 20px;
                        }
                #shoppingCartListing li table td.priceinfo {
                    text-align: right;
                    width: 8ex;
                    padding-right: 1ex;
                }
                    #shoppingCartListing li table td.priceinfo .type {
                        font-weight: bold;
                        font-size: 11px;
                    }
                    #shoppingCartListing li table td.price {
                    }
    #shoppingCart .buybutton {
        padding: 10px 0;
    }
        #shoppingCart .buybutton .linkButton_big {
            margin: 0 auto;
        }



.dropdownbox,
.dropdownbox li, 
.dropdownbox ul {
    margin:0;
    padding:0;
    display: block;
    list-style: none;
}

.dropdownbox {
    overflow: hidden;
    font-size: 11px;
    height: 20px;
    width: 100px;
    background: url(/images/dropdownbox/dropdownbox.png) top right no-repeat;
}
    .dropdownbox li {
        height: 20px;
        line-height: 20px;
        vertical-align: middle;
    }
    .dropdownbox li.searchfield {
        padding-left: 15px;
        padding-right: 20px;
        position: relative; /* is this ok? */
    }
    .dropdownbox li.searchfield div.button {
        background: url(/images/dropdownbox/droparrow_closed.png) center no-repeat;
        position: absolute;
        top: 0px;
        right: -1px;
        height: 20px;
        width: 20px;
    }
    .dropdownbox li.searchfield div.open {
        top: 1px;
        right: 0px;
        background: url(/images/dropdownbox/droparrow_open.png) center no-repeat;
    }

    .loginGenderMale .dropdownbox li.searchfield div {
        background-image: url(/images/dropdownbox/droparrow_closed_blue.png);
    }
    .loginGenderMale .dropdownbox li.searchfield div.open {
        background-image: url(/images/dropdownbox/droparrow_open_blue.png);
    }
    .loginGenderFemale .dropdownbox li.searchfield div{
        background-image: url(/images/dropdownbox/droparrow_closed_red.png);
    }
    .loginGenderFemale .dropdownbox li.searchfield div.eopn{
        background-image: url(/images/dropdownbox/droparrow_open_red.png);
    }
    .dropdownbox li.options {
        display: none;
        height: auto;
        background: url(/images/dropdownbox/dropfield_bottom.png) bottom left no-repeat;
        padding-bottom: 8px;
    }

        .dropdownbox li.options ul {
            background: url(/images/dropdownbox/dropfield_background.png) top left repeat-y;
            padding-top: 0;
        }
        *html .dropdownbox li.options ul {
            margin-top: -16px;
        }
        *+html .dropdownbox li.options ul {
            margin-top: -16px;
        }
            .dropdownbox li.option {
                color: white;
                /*font-weight: bold;*/
                padding-left: 15px;
            }
            .dropdownbox li.option:hover {
                background: url(/images/dropdownbox/dropselecta.png) 9px -1px no-repeat;
            }
            .loginGenderMale .dropdownbox li.option:hover {
                background-image: url(/images/dropdownbox/dropselecta_blue.png);
            }
            .loginGenderFemale .dropdownbox li.option:hover {
                background-image: url(/images/dropdownbox/dropselecta_red.png);
            }

    

.phoneNumberDropDown {
    width: 77px;
    background: url(/images/dropdownbox/dropdownbox_phonenumber.png) top right no-repeat;
}
        .phoneNumberDropDown li.options ul {
            background: url(/images/dropdownbox/dropfield_background_phonenumber.png) top left repeat-y;
        }
    .phoneNumberDropDown li.options {
        background: url(/images/dropdownbox/dropfield_bottom_phonenumber.png) bottom left no-repeat;
    }

            .phoneNumberDropDown li.option:hover {
                background: url(/images/dropdownbox/dropselecta_phonenumber.png) 9px -1px no-repeat;
            }
            .loginGenderMale .phoneNumberDropDown li.option:hover {
                background-image: url(/images/dropdownbox/dropselecta_blue_phonenumber.png);
            }
            .loginGenderFemale .phoneNumberDropDown li.option:hover {
                background-image: url(/images/dropdownbox/dropselecta_red_phonenumber.png);
            }


form {
}
    form label {
        height: 28px;
        line-height: 28px;
        vertical-align: middle;
        font-size: 12px;
        font-weight: bold;
    }
        form label.active {
            color: white;
        }

    form .errorMsg {
        height: 20px;
        line-height: 20px;
        position: relative;
        white-space: nowrap;
        vertical-align: top;
        color: #E3213C;
        font-size: 12px;
    }

    form input {
        /*height: 20px;*/
        /*line-height: 20px;*/
        border: none;
        outline:none;
        padding: 0;
        margin:0;
        font-size: 11px;
        vertical-align: middle;
        color: #999;
    }

    form input.active, 
    form input:focus, 
    form input:active {
        color: #333;
    }
    form input.inactivetext:focus, 
    form input.inactivetextSmall:focus {
        color: #999;
    }
    
    
        form input.submit, 
        form input.submit_small,
        form input.submit_medium, 
        form input.submit_big {
            font-family:Trebuchet MS,Arial,Helvetica,sans-serif;
            height: 20px;
            line-height: 20px;
            color: #a9a9a9;
            cursor: pointer;
        }
            form input.submit:hover, 
            form input.submit_small:hover,
            form input.submit_medium:hover, 
            form input.submit_big:hover {
                color: white;
            }

        form input.submit_small {
            width: 47px;
            background: url(/images/buttons/button_small.png) center left no-repeat;
        }

        form input.submit_medium {
            width: 120px;
            background: url(/images/buttons/button_medium.png) center left no-repeat;
        }
        
        form input.submit, 
        form input.submit_big {
            width: 179px;
            background: url(/images/buttons/button_big.png) center left no-repeat;
        }
        /*
        * html form input.submit {
            background: none;
            filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod=crop, src='/images/forms/submit.png');
        }
            */

            /*
            form input.submit:hover {
                cursor: pointer;
                color: white;
                background: url(/images/forms/submit_hover.png) center left no-repeat;
            }
            * html form input.submit:hover {
                background: none;
                filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod=crop, src='/images/forms/submit_hover.png');
            }
            form input.submit:active {
                background: url(/images/forms/submit_active.png) center left no-repeat;
            }
            * html form input.submit:active {
                background: none;
                filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod=crop, src='/images/forms/submit_active.png');
            }
            */

        form input.text, 
        form input.textSmall, 
        form input.inactivetext, 
        form input.inactivetextSmall, 
        form input.password, 
        form input.passwordSmall {
            height: 20px;
            line-height: 20px;
            padding: 4px 20px;
        }
        form input.text, 
        form input.inactivetext, 
        form input.password {
            background: url(/images/forms/input_text.png) left center no-repeat;
            width: 139px;
        }
        * html form input.text, 
        * html form input.inactivetext, 
        * html form input.password {
            background: none;
            filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod=crop, src='/images/forms/input_text.png');
        }
        form input.textSmall, 
        form input.inactivetextSmall, 
        form input.passwordSmall {
            background: url(/images/forms/input_text_small.png) left center no-repeat;
            width: 60px;
        }
        * html form input.textSmall, 
        * html form input.inactivetextSmall, 
        * html form input.passwordSmall {
            background: none;
            filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod=crop, src='/images/forms/input_text_small.png');
        }

        form input.activeText,
        form input.text:focus,
        form input.text:active, 
        form input.activePassword,
        form input.password:focus,
        form input.password:active {
            background: url(/images/forms/input_text_focus.png) left center no-repeat;
        }
        * html form input.activeText,
        * html form input.text:focus,
        * html form input.text:active, 
        * html form input.activePassword,
        * html form input.password:focus,
        * html form input.password:active {
            background: none;
            filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod=crop, src='/images/forms/input_text_focus.png');
        }
        form input.activeTextSmall,
        form input.textSmall:focus,
        form input.textSmall:active, 
        form input.passwordSmall:focus,
        form input.passwordSmall:active {
            background: url(/images/forms/input_text_focus_small.png) left center no-repeat;
        }
        * html form input.textSmall:focus,
        * html form input.textSmall:active, 
        * html form input.passwordSmall:focus,
        * html form input.passwordSmall:active {
            background: none;
            filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod=crop, src='/images/forms/input_text_focus_small.png');
        }

    /* inputOkBox */
    form .inputOkBox {
        height: 20px;
        line-height: 20px;
    }
        form .inputOkBox input {
            height: 20px;
            line-height: 20px;
            float: left;
        }
        form .inputOk_input {
            background: url(/images/forms/inputOk_input.png) left center no-repeat;
            padding-left: 10px;
        }
        form .inputOk_button {
            color: white;
            padding-left: 17px;
            line-height: 20px;
            text-align: left;
            width: 45px;
            background: url(/images/forms/inputOk_button.png) top center no-repeat;
        }
        form .inputOk_button:active {
            background: url(/images/forms/inputOk_button_active.png) top center no-repeat;
        }
        * html form .inputOk_input {
            background: none;
            filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod=crop, src='/images/forms/inputOk_input.png');
        }
        * html form .inputOk_button {
            background: none;
            filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod=crop, src='/images/forms/inputOk_button.png');
        }
        * html form .inputOk_button:active {
            background: none;
            filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod=crop, src='/images/forms/inputOk_button_active.png');
        }
    
    /* form input tooltip */
    form .formTooltip {
        display: none;
        position: absolute;
        width: 331px;
        margin-left: -10px;
        font-size: 12px;
        line-height: 150%;
        color: white;
    }

        form .formTooltip a {
            color:#183A8C;
        }
        form .formTooltip .top, 
        form .formTooltip .bottom {
            height: 11px;
            width: 331px;
        }
        form .formTooltip .top {
            background: url(/images/forms/tooltipSide_top.png) left top no-repeat;
        }
        * html form .formTooltip .top {
            background: none;
            filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod=crop, src='/images/forms/tooltipSide_top.png');
        }
        form .formTooltip .left {
            background: url(/images/forms/tooltipSide_left.png) left center no-repeat;
            padding-left: 36px;
        }
        * html form .formTooltip .left {
            background: none;
            filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod=crop, src='/images/forms/tooltipSide_left.png');
        }
        form .formTooltip .right {
            background: url(/images/forms/tooltipSide_right.png) right center no-repeat;
            padding-right: 11px;
        }
        * html form .formTooltip .right {
            background: none;
            filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod=crop, src='/images/forms/tooltipSide_right.png');
        }
        form .formTooltip .content {
            background: url(/images/forms/tooltipSide_content.png) top left repeat;
            min-height: 49px;
        }
        * html form .formTooltip .content {
            background: none;
            filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod=crop, src='/images/forms/tooltipSide_content.png');
        }
        form .formTooltip .bottom {
            background: url(/images/forms/tooltipSide_bottom.png) left top no-repeat;
        }
        * html form .formTooltip .bottom {
            background: none;
            filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod=crop, src='/images/forms/tooltipSide_bottom.png');
        }


    /* form tcWrapper */

    form .tcWrapper {
        position: relative;
    }
        form .tcWrapper .columnLeft {
            width: 150px;
            text-align: right;
        }

        form .tcWrapper .columnMiddle {
            padding-left: 20px;
        }


        form .tcWrapper .errorMsg {
            margin-left: 170px;
        }




.tcWrapper{
    width:100%;
    float:left;
    border: none !important;
}
.tcWrapper .columnLeft{
    float: left;
    /*width: 25%;*/
}
.tcWrapper .columnMiddle {
    overflow:auto;
}
* html .tcWrapper .columnMiddle{float:left}
* html .tcWrapper .columnMiddle .columnMiddleContent{width:100%;}

.tcWrapper .columnRight {
    float:right;
    /*width: 25%;*/
    position:relative;
}


.paginationBox {
}
*+html .paginationBox {
    padding-bottom: 10px;
}

    .paginationBox .infoText {
        float: right;
        color: #444;
        margin-top:14px;    
        margin-right:10px;        
    }
    .paginationBox .linkBox {
        float: right;
    }
        .paginationBox .linkBox a {
            height: 20px;
            margin-bottom:10px;
            margin-top:10px;            
            display: block;
            float: left;
        }
    
        .paginationBox .linkBox .pre {
            width: 35px;
            background: url(/images/paginate/paginateleft.png) top left no-repeat;
            margin-right: 5px;
        }
        .paginationBox .linkBox .next {
            width: 35px;
            background: url(/images/paginate/paginateright.png) top left no-repeat;
        }
        .paginationBox .linkBox .pagenumber {
            width: 21px;
            background: url(/images/paginate/paginatebubble.png) top left no-repeat;
            text-align: center;
            vertical-align: middle;
            line-height: 20px;
            margin-right: 5px;
        }
        .paginationBox .linkBox .active {
            color: white;
        }


.contentBlock,
.contentBox {
    font-size: 11px;
    color: white;
}
.contentBox {
    margin-bottom: 10px;
    border: 1px solid #1c1c1c;
}
    .contentBlock h1,
    .contentBox h1 {
        font-size: 16px;
        font-weight: bold;
        color: white;
    }
    .contentBlock h2,
    .contentBox h2 {
        font-size: 12px;
        font-weight: bold;
        color: #999;
        margin-left: 60px;
        margin-bottom: 40px;
        margin-top: -0.5em;

    }
    .contentBlock h3,
    .contentBox h3 {
        font-size: 10px;
        font-weight: bold;
        color: #666;
    }

/* ---------- clearfix ---------- */
/* inner float is containt in box */
.contentBlock:after,
.contentBox:after {
    content: "."; 
    display: block; 
    height: 0; 
    clear: both; 
    visibility: hidden;
}
.contentBlock, .contentBox {display: inline-block;}
/* Hides from IE-mac \*/
* html .contentBlock
* html .contentBox {
    height: 1%;
}
.contentBlock, .contentBox {display: block;}
/* End hide from IE-mac */


.songBadge {
    overflow: hidden;
    font-size: 10px;
    padding-bottom: 10px;
    padding-top: 9px; 
    padding-left: 10px;
    width: 148px;
    height: 66px;
    background: url(/images/songBadge/background.png) bottom right no-repeat;
}
    .songBadge a {
        color:#D1D0D6;
    }
    .songBadge a:hover {
        text-decoration: underline;
    }
    .songBadge .title {
        height: 14px;
        line-height: 14px;
        white-space: nowrap;
        /*vertical-align: middle;*/
        /*vertical-align: text-bottom;*/
        font-size: 11px;
/*        padding-left: 19px;*/
        background-position: left center;
        background-repeat: no-repeat;
        color:#D1D0D6;
    }
    
    .songBadge .title img {
        margin-right:5px;
    }    
    
/*    .maleSongBadge .title {*/
/*        background-image: url(/images/main/starblb.png);*/
/*    }*/
/*    .femaleSongBadge .title {*/
/*        background-image: url(/images/main/starblb.png);*/
/*    }*/
    
    .songBadge .songInfoBox {
        margin-top: 8px;
        /*margin-top: 3px;*/
        /*border: 1px solid red;*/
        position: relative;
        height: 44px;
    }
        .songBadge .coverWrapper {
            height: 44px;
            width: 50px;
            position: relative;
        }
            .songBadge .nocover,
            .songBadge .cover {
                height: 44px;
                width: 44px;
                position: absolute;
                top: 0;
                right: 0;
            }
            .songBadge .nocover {
                width: 50px;
            }
            .songBadge .coverOverlay {
                height: 100%;
                width: 100%;
                position: absolute;
                top: 0;
                right: 0;
            }
            .songBadge .albumOverlay {
                background: url(/images/songBadge/album50x44.png) top right no-repeat;
            }
            * html .songBadge .albumOverlay {
                background: none;
                filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod=crop, src='/images/songBadge/album50x44.png');
            }
            .songBadge .singleOverlay {
                background: url(/images/songBadge/single44x44.png) top right no-repeat;
            }
            * html .songBadge .singleOverlay {
                background: none;
                filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod=crop, src='/images/songBadge/single44x44.png');
            }
    * html #LOGO {
    }

        .songBadge .artist,
        .songBadge .time, 
        .songBadge .station {
            position: absolute;
            width: 89px;
            height: 10px;
            left: 55px;
            overflow: hidden;
            white-space: nowrap;
        }
        .songBadge .artist {
            font-size: 11px;
            height: 15px;
            top: -2px;
            color:#D1D0D6;
        }
        .songBadge .time {
            width: 54px;
            height: 25px;
            top: 13px;
            padding: 0px;
            line-height: 10px;
            color: #939393;
        }
        .songBadge .station {
            bottom: -2px;
            padding-bottom: 2px;
        }
        .songBadge .avatar {
            position: absolute;
            height: 35px;
            width: 35px;
            /*top: 15px;*/
            bottom: -4px;
            right: 5px;
            right: 2px;
            background: black;
        }
            .songBadge .avatar img {
                position: relative;
                left: 4px;
                top: 4px;
                /* height: 30px; */
                /* width: 30px; */
            }
            .songBadge .avatar .mask {
                height: 35px;
                width: 35px;
            }
            .songBadge .avatar .mask {
                position: absolute;
                top: 0px;
                left: 0px;
                background-position: center center;
                background-repeat: no-repeat;
            }
            .maleSongBadge .avatar .mask {
                background-image: url(/images/main/user_35x35_grad_male.png);
            }
            .femaleSongBadge .avatar .mask {
                background-image: url(/images/main/user_35x35_grad_female.png);
            }

.playdateBadge {
    width: 200px;
}
    .playdateBadge .title, 
    .playdateBadge .artist,
    .playdateBadge .time, 
    .playdateBadge .station {
            position: absolute;
            width: 143px;
            height: 10px;
            left: 55px;
            overflow: hidden;
            white-space: nowrap;
        }
    .playdateBadge .title {
        height: 11px;
        line-height: 11px;
        white-space: nowrap;
        font-size: 11px;
        padding-left: 0;
        background: none;
        font-size: 11px;
        top: 0px;
        position: absolute;
        font-weight: bold;
    }
        .playdateBadge .artist {
            font-size: 9px;
            height: 15px;
            top: 12px;
            color: #525252;
        }
        .playdateBadge .time {
            height: 25px;
            top: 25px;
            line-height: 9px;
            font-size: 9px;
            color: #525252;
        }


.userBadge {
    height: 73px;
    width: 161px;
    position: relative;
}

    .userBadge img.avatar {
        position: absolute;
        /* height: 50px; */
        /* width: 50px; */
        top: 6px;
        left: 6px;
    }
    .userBadge .badge {
        position: absolute;
        top:0px;
        left:0px;
        height: 100%;
        width: 100%;
    }
    .userBadge .maleBadge {
        background: url(/images/userBadge/userbadge_backgr_male.png) top left no-repeat;
    }
    .userBadge .femaleBadge {
        background: url(/images/userBadge/userbadge_backgr_female.png) top left no-repeat;
    }
        .userBadge .badge .content {
            position: relative;
            width: 94px;
            height: 54px;
            top: 10px;
            left: 60px;
            overflow:hidden;
            font-size:10px;
        }


.resultListing {
    margin:0;
    padding:0;
    list-style: none;
}
    .resultListing li {
        margin:0;
        padding:0;
        display: block;
        width: 100%;
        margin-bottom: 10px;
    }
    * + html .resultListing li {
        margin-bottom: 6px;
    }

    .resultListing li .barWrapper {
        background: url(/images/listing/trackitem_tile.png) top left repeat-x;
        height: 20px;
        line-height: 20px;
        margin:0;
        padding:0;
        display: block;
        width: 100%;
    }
    .resultListing li .barWithInfoBox {
        cursor: pointer;
    }
        .resultListing li.activeLi .barWrapper {
            background: url(/images/listing/trackitem_active_tile.png) top left repeat-x;
            padding: 0 px 0 0;
        }

        /* left end */
        .resultListing li .barWrapper .leftEnd {
            width: 25px;
            height: 100%;
            overflow: hidden;
            background: url(/images/listing/trackitem_left.png) top left no-repeat;
        }
                .resultListing li .barWrapper .leftEnd .label {
                    width: 25px;
                    height: 100%;
                }
                .resultListing li .barWrapper .leftEnd .number {
                    background: url(/images/listing/trackitem_number_left.png) top left no-repeat;
                }
                .resultListing li .barWrapper .leftEnd .number img {
                    display: none;
                }
                .resultListing li .barWrapper .leftEnd .number a img {
                    display: inline;
                }
                .resultListing li .barWrapper .leftEnd .tag {
                    background: url(/images/listing/trackitem_tag_left.png) top left no-repeat;
                }
                .resultListing li .barWrapper .leftEnd .label div {
                    width: 20px;
                    text-align: center;
                }

            .resultListing li.activeLi .barWrapper .leftEnd {
                background: url(/images/listing/trackitem_active_left.png) top left no-repeat;
            }
            .resultListing li.activeLi .barWithInfoBox .leftEnd {
                background: url(/images/listing/trackitem_active_info_left.png) top left no-repeat;
            }
                .resultListing li.activeLi .barWrapper .leftEnd .label {
                }
                .resultListing li.activeLi .barWrapper .leftEnd .number {
                    background-image: url(/images/listing/trackitem_number_active_left.png);
                }
                .resultListing li.activeLi .barWrapper .leftEnd .number div {		    
                    font-size: 0px;
                    /*background: url(/images/dropdownbox/droparrow_closed_red.png) center no-repeat;*/
                    top: 1px;
                    left: 3px;
                    height: 20px;
                    width: 20px;
                }
                .resultListing li.activeLi .barWrapper .leftEnd .number img {
                    display: block;
                }
                .resultListing li.activeLi .barWithInfoBox .leftEnd .number {
                    background-image: url(/images/listing/trackitem_number_active_info_left.png);
                }
                .resultListing li.activeLi .barWrapper .leftEnd .tag {
                    background-image: url(/images/listing/trackitem_tag_active_left.png);
                }
                .resultListing li.activeLi .barWithInfoBox .leftEnd .tag {
                    background-image: url(/images/listing/trackitem_tag_active_info_left.png);
                }

        /* right end */
        .resultListing li .barWrapper .rightEnd {
            height: 100%;
            width: 25px;
            background: url(/images/listing/trackitem_right.png) top right no-repeat;
        }
        .resultListing li.activeLi .barWrapper .rightEnd {
            background: url(/images/listing/trackitem_active_right.png) top right no-repeat;
        }
        .resultListing li.activeLi .barWithInfoBox .rightEnd {
            background: url(/images/listing/trackitem_active_info_right.png) top right no-repeat;
        }
            .resultListing li.activeLi .barWrapper .rightEnd .bar {
                background: url(/images/listing/trackitem_bar_active_right.png) top right no-repeat;
                height: 100%;
            }
            .resultListing li.activeLi .barWithInfoBox .rightEnd .bar {
                background: url(/images/listing/trackitem_bar_active_info_right.png) top right no-repeat;
            }
            
            .resultListing li.withBar .rightEnd {
                width: auto;
                width: 102px;
            }
                .resultListing li.withBar .rightEnd .barLabel {
                    float: right;
                    margin-right: 10px;
                }

                .resultListing li.withBar .rightEnd .bar {
                    padding: 0 1px;
                    padding-top: 1px;
                    width: 102px;
                    float: right;
                }
                * + html .resultListing li.withBar .rightEnd .bar {
                    width: 100px;
                }
                    .resultListing li.withBar .rightEnd .bar div {
                        height: 18px;
                    }
                    .resultListing li.withBar .rightEnd .bar div.left {
                        float: left;
                        width: 10px;
                        background: url(/images/listing/ratingbubble_left.png) top right no-repeat;
                    }
                    .resultListing li.withBar .rightEnd .bar div.right {
                        width: 10px;
                        background: url(/images/listing/ratingbubble_right.png) top right no-repeat;
                        float: right;
                    }
                    .resultListing li.withBar .rightEnd .bar div.middle {
                        margin: 0 10px;
                    }
                        .resultListing li.withBar .rightEnd .bar div.middle div {
                            height: 18px;
                            width: 100%;
                            background: #183a8c;
                        }

        /* entries */
        .resultListing li .barWrapper .columnMiddleContent .entry {
            float: left;
            overflow: hidden;
            white-space: nowrap;
            line-height: 20px;
            vertical-align: middle;
            color:#696969;
        }
        
        .resultListing li.activeLi .barWrapper .columnMiddleContent .entry {
            color:white;
        }  
        
            .resultListing li .barWrapper .columnMiddleContent .entry .newMsgIcon {
                visibility:hidden;
                font-weight:bold;  
                margin-right:10px;
            }
            .resultListing li.newMsg .barWrapper .columnMiddleContent .entry .newMsgIcon {
                visibility:visible;
                margin-right:10px;    
                font-weight:bold;
                color:white;                
            }
            .resultListing li .barWrapper .columnMiddleContent .entry .avatarThumbnail {
                height: 18px;
                position: relative;
                line-height: 20px;
                vertical-align: middle;
            }

    /* heading */
    .resultListing li.heading .barWrapper {
        background: url(/images/listing/trackitem_heading_middle.png) top right repeat-x;
        color: #666;
        color: white;
        font-weight: bold;
        font-size: 11px;
    }
        .resultListing li.heading .barWrapper .entry {
            color: white;
            font-weight: bold;
        }
        .resultListing li.heading .barWrapper .leftEnd {
            background: url(/images/listing/trackitem_heading_left.png) top left no-repeat;
        }
            .resultListing li.heading .barWrapper .leftEnd .label {
                background: none;
            }
        .resultListing li.heading .barWrapper .rightEnd {
            background: url(/images/listing/trackitem_heading_right.png) top right no-repeat;
            text-align: left;
        }
            .resultListing li.heading .rightEnd .barLabel {
                float: none;
            }


        /* InfoBox */
        #mainContent .resultListing .listingInfoBox {
            overflow: hidden;
            display: none;
            position: relative;
        }
        #mainContent .resultListing li.activeLi .listingInfoBox {
            display: block;
            background: url(/images/listing/trackInfoBox.png) bottom left no-repeat;
            padding: 0 1px 1px 1px;
        }
                #mainContent .resultListing .listingInfoBox {
                    padding: 10px 0 0 0; 
                    font-weight: normal;
                }
                    #mainContent .resultListing .Msg .listingInfoBox .msgBody {
                        padding: 10px;
                    }
                        #mainContent .resultListing .Msg .listingInfoBox .msgBody .msgText {
                            height: 173px;
                            width: 297px;
                            padding: 10px 10px 10px 50px;
                            margin-left: -5px;
                            background: url(/images/views/mailframe.png) top left no-repeat;
                        }
                        #mainContent .resultListing .Msg .listingInfoBox .msgBody li {
                            display: list-item;
                        }
                    #mainContent .resultListing .Msg .listingInfoBox .msgOptions {
                        padding: 10px;
                    }

            /* track info */
            #mainContent .resultListing .listingInfoBox .infoboxBorder {
            }
                #mainContent .resultListing .listingInfoBox .infoboxBorder > .columnMiddleContent {
                    padding-left: 11px;
                    background: url(/images/listing/trackInfoBox_info_border_left.png) left 19px no-repeat;
                    height: 168px;
                }
                    #mainContent .resultListing .listingInfoBox .infoboxBorder .tcWrapper {
                        background: url(/images/listing/trackInfoBox_info_border_tile.png) left 19px repeat-x;
                        height: 168px;
                    }
                #mainContent .resultListing .listingInfoBox .infoboxBorder .tab {
                    margin: 0 35px;
                }
            #mainContent .resultListing .listingInfoBox .buttonBox {
                padding: 10px 30px;
            }
                #mainContent .resultListing .listingInfoBox .buttonBox .text, 
                #mainContent .resultListing .listingInfoBox .buttonBox .linkButton  {
                    float: left;
                    margin: 0;
                    margin-right: 10px;
                    line-height: 20px;
                }
            #mainContent .resultListing .listingInfoBox .trackInfo {
                /*background: url(/images/views/boxgradient.png) top left repeat-x;*/
                margin: 0;
            }

                #mainContent .resultListing .listingInfoBox .trackInfo .bottomBox {
                    position: absolute;
                    bottom: 0px; 
                    right: 0px; 
                    padding: 0;
                    margin: 0;
                    margin-bottom: 0px; 
                    margin-right: 20px; 
                    width: 500px; 
                    height: 55px; 
                    float: right;
                }
                    #mainContent .resultListing .listingInfoBox .trackInfo .bottomBox .infoButton {
                        float: right; 
                        background-image: url(/images/listing/trackInfoBox_button.png);
                        background-position: bottom left;
                        background-repeat: no-repeat; 
                        width: 49px; 
                        height: 55px;
                        margin-right: 10px;
                        overflow: hidden;
                        color: white;

                    }
                        #mainContent .resultListing .listingInfoBox .trackInfo .bottomBox .infoButton .iconButton {
                            margin: 4px auto;
                        }
                #mainContent .resultListing .listingInfoBox .trackInfo .columnLeft {
                    width: 200px;
                    margin-right: 15px;
                }
                    #mainContent .resultListing .listingInfoBox .trackInfo .columnLeft .bigPic {
                        height: 90px;
                        width: 90px;
                        overflow: hidden;
                        text-align: center;
                        float: left;
                    }
                        #mainContent .resultListing .listingInfoBox .trackInfo .columnLeft .bigPic img {
                            height: 100%;
                        }
                    #mainContent .resultListing .listingInfoBox .trackInfo .columnLeft .smallPicBox {
                        margin-left: 100px;
                    }

                        #mainContent .resultListing .listingInfoBox .trackInfo .columnLeft .noPic, 
                        #mainContent .resultListing .listingInfoBox .trackInfo .columnLeft .smallPic {
                            height: 40px;
                            width: 45px;
                            text-align: right;
                            position: relative;
                            overflow: hidden;
                            float: left;
                            margin: 0 10px 10px 0px;
                        }
                        #mainContent .resultListing .listingInfoBox .trackInfo .columnLeft .noPic {
                            border: 1px solid #999;
                            height: 38px;
                            width: 43px;
                        }
                            #mainContent .resultListing .listingInfoBox .trackInfo .columnLeft .smallPic img {
                                text-align: right;
                                height: 40px;
                                width: 40px;
                                margin-left: 5px;
                            }
                            #mainContent .resultListing .listingInfoBox .trackInfo .columnLeft .smallPic .overlay {
                                height: 100%;
                                width: 100%;
                                background: url(/images/songBadge/album45x40.png) top left no-repeat;
                                position: absolute;
                                top: 0px;
                                left: 0px;
                            }

                #mainContent .resultListing .listingInfoBox .trackInfo .columnRight {
                    width: 170px;
                    padding-right: 30px;
                }
                    #mainContent .resultListing .listingInfoBox .trackInfo .columnRight .bigWheel {
                        height: 88px;
                        width: 88px;
                        overflow: hidden;
                        position: relative;
                        float: left;
                    }
                        #mainContent .resultListing .listingInfoBox .trackInfo .columnRight .bigWheel img {
                            position: absolute;
                            left:8px;
                            top:8px;
                        }

                        #mainContent .resultListing .listingInfoBox .trackInfo .columnRight .bigWheel .overlay {
                            background: url(/images/main/dudewheel.png) top left no-repeat;
                            position: absolute;
                            top: 0px;
                            left: 0px;
                            height: 88px;
                            width: 88px;
                        }
                        #mainContent .resultListing .listingInfoBox .trackInfo .columnRight .bigWheel .femaleWheel {
                            background: url(/images/main/girlwheel.png) top left no-repeat;
                        }

                    #mainContent .resultListing .listingInfoBox .trackInfo .columnRight .wheelBox {
                        margin-left: 90px;
                        padding-top: 4px;
                    }
                        #mainContent .resultListing .listingInfoBox .trackInfo .columnRight .wheelBox .smallWheel {
                            height: 35px;
                            width: 35px;
                            float: left;
                            overflow: hidden;
                            position: relative;
                            margin-bottom: 10px;
                            margin-left: 5px;
                        }
                            #mainContent .resultListing .listingInfoBox .trackInfo .columnRight .smallWheel img {
                                /* width: 31px; */
                                /* height: 31px; */
                                margin-top: 4px;
                                margin-left: 4px;
                            }
                            #mainContent .resultListing .listingInfoBox .trackInfo .columnRight .smallWheel .overlay {
                                background: url(/images/main/dudewheel35x35.png) top left no-repeat;
                                position: absolute;
                                top: 0px;
                                left: 0px;
                                height: 35px;
                                width: 35px;
                            }
                            #mainContent .resultListing .listingInfoBox .trackInfo .columnRight .smallWheel .femaleWheel {
                                background: url(/images/main/girlwheel35_x35.png) top left no-repeat;
                            }
                #mainContent .resultListing .listingInfoBox .trackInfo .columnMiddle {
                }
                #mainContent .resultListing .listingInfoBox .trackInfo .columnMiddleContent {
                }
                    #mainContent .resultListing .listingInfoBox .trackInfo .youTubeBox {
                        height: 120px;
                        width: 160px;
                        padding-top: 20px;
                        overflow: hidden;
                    }
                        #mainContent .resultListing .listingInfoBox .trackInfo .youTubeBox img {
                            width: 70px;
                            height: 55px;
                            margin-right: 5px;
                            margin-bottom: 5px;
                        }

                #mainContent .resultListing .listingInfoBox .trackInfo .playedOn {
                    padding: 10px 30px;
                    margin-top: 10px;
                    border-top: 1px solid #999;
                }


.StyleWheel a.label {
}
.StyleWheel a.label:hover {
    color: white;
}


#StyleInfoSite {
    font-size: 12px;
    line-height: 120%;
}
    #StyleInfoSite a{
    }
    #StyleInfoSite h1{
    }
    #StyleInfoSite h2 {
        color: white;
        margin-left: 0;
        margin-top: 2em;
        margin-bottom: 1em;
        font-size: 14px;
    }
    #StyleInfoSite h3 {
    }
    #StyleInfoSite p {
        text-align: justify;
        text-indent: 1em;
    }
    #StyleInfoSite ul {
    }
    #StyleInfoSite ul li {
    }
    #StyleInfoSite ol {
    }
    #StyleInfoSite ol li {
    }


.Tooltip {
    position: absolute;
    /*border: 1px solid pink;*/
    display: none;
    font-size: 11px;
    z-index: 32000;
    color: #a9a9a9;
}

    .fixedTooltip {
        display: block !important;
    }

    .Tooltip .cornerTopleft,
    .Tooltip .cornerBottomleft,
    .Tooltip .sideLeft{
        /*border: 1px solid yellow;*/
        padding-left: 11px;
    }
        .TooltipRight .cornerTopleft,
        .TooltipRight .cornerBottomleft {
            margin-left: 14px;
        }
        .TooltipRight .sideLeft{
            padding-left: 25px;
        }

    .Tooltip .cornerTopright,
    .Tooltip .cornerBottomright,
    .Tooltip .sideRight {
        /*border: 1px solid red;*/
        padding-right: 11px;
    }
        .TooltipLeft .cornerTopright,
        .TooltipLeft .cornerBottomright {
            margin-right: 14px;
        }
        .TooltipLeft .sideRight {
            padding-right: 25px;
        }

    .Tooltip .sideTop,
    .Tooltip .sideBottom {
        /*border: 1px solid green;*/
        height: 11px;
    }
        .TooltipBottom .sideTop,
        .TooltipTop .sideBottom {
            height: 25px;
        }

    .Tooltip .middle {
        /*border: 1px solid green;*/
        background: url(/images/tooltip/middle.png) top left repeat; 
    }
    .fixedTooltip .middle > div {
        min-height: 20px;
        padding: 1px;
    }

    .Tooltip .cornerTopleft {
        background: url(/images/tooltip/corner_top_left.png) bottom left no-repeat;
    }
    .Tooltip .cornerTopright {
        background: url(/images/tooltip/corner_top_right.png) bottom right no-repeat;
    }
    .Tooltip .cornerBottomleft {
        background: url(/images/tooltip/corner_bottom_left.png) top left no-repeat;
    }
    .Tooltip .cornerBottomright {
        background: url(/images/tooltip/corner_bottom_right.png) top right no-repeat;
    }

    .Tooltip .sideTop {
        background: url(/images/tooltip/side_top.png) bottom center no-repeat;
    }
        .TooltipBottom .sideTop {
            background: url(/images/tooltip/pointer_top.png) bottom center no-repeat;
        }

    .Tooltip .sideBottom {
        background: url(/images/tooltip/side_bottom.png) top center no-repeat;
    }
        .TooltipTop .sideBottom {
            background: url(/images/tooltip/pointer_bottom.png) top center no-repeat;
        }

    .Tooltip .sideLeft {
        background: url(/images/tooltip/side_left.png) left center no-repeat;
    }
        .TooltipRight .sideLeft {
            background: url(/images/tooltip/pointer_left.png) left center no-repeat;
        }

    .Tooltip .sideRight {
        background: url(/images/tooltip/side_right.png) right center no-repeat;
    }
        .TooltipLeft .sideRight {
            background: url(/images/tooltip/pointer_right.png) right center no-repeat;
        }




/* ========== link buttons */
.linkButton,
.linkButton_small,
.linkButton_medium,
.linkButton_big {
    height: 20px;
    overflow: hidden;
    color: white;
    position: relative;
    text-align: center;
    margin: 5px 0;
}

.linkButton_small {
    width: 47px;
    background: url(/images/buttons/button_small.png) top left no-repeat;
}
.linkButton,
.linkButton_medium {
    width: 120px;
    background: url(/images/buttons/button_medium.png) top left no-repeat;
}
.linkButton_big {
    width: 179px;
    background: url(/images/buttons/button_big.png) top left no-repeat;
}
    .linkButton span, 
    .linkButton a, 
    .linkButton_small span, 
    .linkButton_small a,
    .linkButton_medium span, 
    .linkButton_medium a,
    .linkButton_big span, 
    .linkButton_big a {
        color:#a9a9a9;
        line-height: 20px;
        display: block;
    }

    .linkButton a:hover
    .linkButton_small a:hover
    .linkButton_medium a:hover
    .linkButton_big a:hover {
        color:white;
    }


    .linkButton .overlay {
        background: url(/images/1x1_0.75_black.png) top left repeat;
        top: 0px;
        left: 0px;
        position: absolute;
        height: 100%;
        width: 100%;
    }

/* ========== switch button */
.switchButton {
    width: 184px;
    height: 20px;
    line-height: 20px;
}
    .switchButtonLeft {
        background: url(/images/buttons/switchbutton_left.png) center no-repeat;
    }
    .switchButtonRight {
        background: url(/images/buttons/switchbutton_right.png) center no-repeat;
    }

    .switchButton div {
        width: 50%;
        text-align: center;
        float: left;
        height: 20px;
    }

/* ========== button_bar */
.button_bar {
    margin: 0 auto;
    text-align: center;
}

/* ========== icon_button */
.iconButton {
    width: 47px;
    margin: 0 0px;
}
    .iconButton div.wrapper {
        position: relative;
        /*width: 100%;*/
    }
        .iconButton div.small {
            /*width: 35px;*/
        }
    .iconButton .caption {
        text-align: center;
    }
        .iconButton .active .caption {
            color: white;
        }

    /* new Items blob */
    .iconButton span.newItems {
        display: block;
        /*height: 17px;*/
        /*width: 17px;*/
        /*line-height: 17px;*/
            height: 13px;
            width: 13px;
            line-height: 13px;
        vertical-align: middle;
        text-align: center;
        position: absolute;
        top: 0px;
        left: 25px;
        color:#D1D0D6;
        text-decoration: none;
        /*font-size: 10px;*/
            font-size: 9px;
            font-weight: bold;
        background-repeat: none;
        background-position: center;
        /*background-image: url(/images/buttons/newItem_big_blue.png);*/
            background-image: url(/images/button/newItem_small_blue.png);
    }
        .small .iconButton span.newItems {
            background-image: url(/images/button/newItem_small_blue.png);
            height: 13px;
            width: 13px;
            line-height: 13px;
            font-weight: bold;
        }
        .iconButton .blue span.newItems {
            /*background-image: url(/images/buttons/newItem_big_red.png);*/
                background-image: url(/images/buttons/newItem_small_red.png);
        }
            .small .iconButton .blue span.newItems {
                background-image: url(/images/buttons/newItem_small_red.png);
            }

        .iconButton .red span.newItems {
            /*background-image: url(/images/button/newItem_big_blue.png);*/
                background-image: url(/images/button/newItem_small_blue.png);
        }
        
            .small .iconButton .red span.newItems {
                background-image: url(/images/button/newItem_small_blue.png);
            }

    .iconButton .icon {
        height: 47px;
        width: 47px;
        background-position: center;
        background-repeat: no-repeat;
        margin: 0 auto;
    }
        .iconButton .small .icon {
            height: 35px;
            width: 35px;
        }

        /* ------------------------------------------------------------
         * template style definition for an icon button
         * just replace all occurrence of TEMPLATE by the name of the button (i.e. mail)
         * ------------------------------------------------------------ */
        /*  ===== TEMPLATE ===== */
        .iconButton .TEMPLATEIcon, 
        .iconButton .small_TEMPLATEIcon, 
        .iconButton .big_TEMPLATEIcon, 
        .iconButton .gray_TEMPLATEIcon,
        .iconButton .blue_TEMPLATEIcon,
        .iconButton .red_TEMPLATEIcon, 
        .iconButton .small_gray_TEMPLATEIcon,
        .iconButton .small_blue_TEMPLATEIcon,
        .iconButton .small_red_TEMPLATEIcon, 
        .iconButton .big_gray_TEMPLATEIcon,
        .iconButton .big_blue_TEMPLATEIcon,
        .iconButton .big_red_TEMPLATEIcon {
            background-image: url(/images/buttons/TEMPLATE/TEMPLATE_small_gray.png);
        }

            /* ----- big */
            .iconButton:hover .TEMPLATEIcon, 
            .iconButton .active .TEMPLATEIcon 
            .iconButton:hover .big_TEMPLATEIcon, 
            .iconButton .active .big_TEMPLATEIcon {
                background-image: url(/images/buttons/TEMPLATE/TEMPLATE_big_blue.png);
            } 

            .iconButton:hover .gray_TEMPLATEIcon, 
            .iconButton .active .gray_TEMPLATEIcon,
            .iconButton:hover .big_gray_TEMPLATEIcon, 
            .iconButton .active .big_gray_TEMPLATEIcon {
                background-image: url(/images/buttons/TEMPLATE/TEMPLATE_big_red.png);
            }
            .iconButton:hover .blue_TEMPLATEIcon, 
            .iconButton .active .blue_TEMPLATEIcon, 
            .iconButton:hover .big_blue_TEMPLATEIcon, 
            .iconButton .active .big_blue_TEMPLATEIcon {
                background-image: url(/images/buttons/TEMPLATE/TEMPLATE_big_blue.png);
            }
            .iconButton:hover .red_TEMPLATEIcon, 
            .iconButton .active .red_TEMPLATEIcon, 
            .iconButton:hover .big_red_TEMPLATEIcon, 
            .iconButton .active .big_red_TEMPLATEIcon {
                background-image: url(/images/buttons/TEMPLATE/TEMPLATE_big_red.png);
            }
            
            /* ----- small */
            .iconButton:hover .small_TEMPLATEIcon, 
            .iconButton .active .small_TEMPLATEIcon {
                background-image: url(/images/buttons/TEMPLATE/TEMPLATE_small_blue.png);
            }
            .iconButton:hover .small_gray_TEMPLATEIcon, 
            .iconButton .active .small_gray_TEMPLATEIcon {
                background-image: url(/images/buttons/TEMPLATE/TEMPLATE_small_red.png);
            }
            .iconButton:hover .small_blue_TEMPLATEIcon, 
            .iconButton .active .small_blue_TEMPLATEIcon {
                background-image: url(/images/buttons/TEMPLATE/TEMPLATE_small_blue.png);
            }
            .iconButton:hover .small_red_TEMPLATEIcon, 
            .iconButton .active .small_red_TEMPLATEIcon {
                background-image: url(/images/buttons/TEMPLATE/TEMPLATE_small_red.png);
            }
        /* ------------------------------------------------------------ */
     
        /*  ===== tag ===== */
        .iconButton .tagIcon, 
        .iconButton .small_tagIcon, 
        .iconButton .big_tagIcon, 
        .iconButton .gray_tagIcon,
        .iconButton .blue_tagIcon,
        .iconButton .red_tagIcon, 
        .iconButton .small_gray_tagIcon,
        .iconButton .small_blue_tagIcon,
        .iconButton .small_red_tagIcon, 
        .iconButton .big_gray_tagIcon,
        .iconButton .big_blue_tagIcon,
        .iconButton .big_red_tagIcon {
            background-image: url(/images/buttons/tag/tag_small_gray.png);
        }

            /* ----- big */
            .iconButton:hover .tagIcon, 
            .iconButton .active .tagIcon 
            .iconButton:hover .big_tagIcon, 
            .iconButton .active .big_tagIcon {
                background-image: url(/images/buttons/tag/tag_big_blue.png);
            } 

            .iconButton:hover .gray_tagIcon, 
            .iconButton .active .gray_tagIcon,
            .iconButton:hover .big_gray_tagIcon, 
            .iconButton .active .big_gray_tagIcon {
                background-image: url(/images/buttons/tag/tag_big_red.png);
            }
            .iconButton:hover .blue_tagIcon, 
            .iconButton .active .blue_tagIcon, 
            .iconButton:hover .big_blue_tagIcon, 
            .iconButton .active .big_blue_tagIcon {
                background-image: url(/images/buttons/tag/tag_big_blue.png);
            }
            .iconButton:hover .red_tagIcon, 
            .iconButton .active .red_tagIcon, 
            .iconButton:hover .big_red_tagIcon, 
            .iconButton .active .big_red_tagIcon {
                background-image: url(/images/buttons/tag/tag_big_red.png);
            }
            
            /* ----- small */
            .iconButton:hover .small_tagIcon, 
            .iconButton .active .small_tagIcon {
                background-image: url(/images/buttons/tag/tag_small_blue.png);
            }
            .iconButton:hover .small_gray_tagIcon, 
            .iconButton .active .small_gray_tagIcon {
                background-image: url(/images/buttons/tag/tag_small_red.png);
            }
            .iconButton:hover .small_blue_tagIcon, 
            .iconButton .active .small_blue_tagIcon {
                background-image: url(/images/buttons/tag/tag_small_blue.png);
            }
            .iconButton:hover .small_red_tagIcon, 
            .iconButton .active .small_red_tagIcon {
                background-image: url(/images/buttons/tag/tag_small_red.png);
            }
        /* ------------------------------------------------------------ */

        /*  ===== friends ===== */
        .iconButton .friendsIcon, 
        .iconButton .small_friendsIcon, 
        .iconButton .big_friendsIcon, 
        .iconButton .gray_friendsIcon,
        .iconButton .blue_friendsIcon,
        .iconButton .red_friendsIcon, 
        .iconButton .small_gray_friendsIcon,
        .iconButton .small_blue_friendsIcon,
        .iconButton .small_red_friendsIcon, 
        .iconButton .big_gray_friendsIcon,
        .iconButton .big_blue_friendsIcon,
        .iconButton .big_red_friendsIcon {
            background-image: url(/images/buttons/friends/friends_small_gray.png);
        }

            /* ----- big */
            .iconButton:hover .friendsIcon, 
            .iconButton .active .friendsIcon 
            .iconButton:hover .big_friendsIcon, 
            .iconButton .active .big_friendsIcon {
                background-image: url(/images/buttons/friends/friends_big_blue.png);
            } 

            .iconButton:hover .gray_friendsIcon, 
            .iconButton .active .gray_friendsIcon,
            .iconButton:hover .big_gray_friendsIcon, 
            .iconButton .active .big_gray_friendsIcon {
                background-image: url(/images/buttons/friends/friends_big_red.png);
            }
            .iconButton:hover .blue_friendsIcon, 
            .iconButton .active .blue_friendsIcon, 
            .iconButton:hover .big_blue_friendsIcon, 
            .iconButton .active .big_blue_friendsIcon {
                background-image: url(/images/buttons/friends/friends_big_blue.png);
            }
            .iconButton:hover .red_friendsIcon, 
            .iconButton .active .red_friendsIcon, 
            .iconButton:hover .big_red_friendsIcon, 
            .iconButton .active .big_red_friendsIcon {
                background-image: url(/images/buttons/friends/friends_big_red.png);
            }
            
            /* ----- small */
            .iconButton:hover .small_friendsIcon, 
            .iconButton .active .small_friendsIcon {
                background-image: url(/images/buttons/friends/friends_small_blue.png);
            }
            .iconButton:hover .small_gray_friendsIcon, 
            .iconButton .active .small_gray_friendsIcon {
                background-image: url(/images/buttons/friends/friends_small_red.png);
            }
            .iconButton:hover .small_blue_friendsIcon, 
            .iconButton .active .small_blue_friendsIcon {
                background-image: url(/images/buttons/friends/friends_small_blue.png);
            }
            .iconButton:hover .small_red_friendsIcon, 
            .iconButton .active .small_red_friendsIcon {
                background-image: url(/images/buttons/friends/friends_small_red.png);
            }
        /* ------------------------------------------------------------ */

        /*  ===== mail ===== */
        .iconButton .mailIcon, 
        .iconButton .small_mailIcon, 
        .iconButton .big_mailIcon, 
        .iconButton .gray_mailIcon,
        .iconButton .blue_mailIcon,
        .iconButton .red_mailIcon, 
        .iconButton .small_gray_mailIcon,
        .iconButton .small_blue_mailIcon,
        .iconButton .small_red_mailIcon, 
        .iconButton .big_gray_mailIcon,
        .iconButton .big_blue_mailIcon,
        .iconButton .big_red_mailIcon {
            background-image: url(/images/buttons/mail/mail_small_gray.png);
        }

            /* ----- big */
            .iconButton:hover .mailIcon, 
            .iconButton .active .mailIcon 
            .iconButton:hover .big_mailIcon, 
            .iconButton .active .big_mailIcon {
                background-image: url(/images/buttons/mail/mail_big_blue.png);
            } 

            .iconButton:hover .gray_mailIcon, 
            .iconButton .active .gray_mailIcon,
            .iconButton:hover .big_gray_mailIcon, 
            .iconButton .active .big_gray_mailIcon {
                background-image: url(/images/buttons/mail/mail_big_red.png);
            }
            .iconButton:hover .blue_mailIcon, 
            .iconButton .active .blue_mailIcon, 
            .iconButton:hover .big_blue_mailIcon, 
            .iconButton .active .big_blue_mailIcon {
                background-image: url(/images/buttons/mail/mail_big_blue.png);
            }
            .iconButton:hover .red_mailIcon, 
            .iconButton .active .red_mailIcon, 
            .iconButton:hover .big_red_mailIcon, 
            .iconButton .active .big_red_mailIcon {
                background-image: url(/images/buttons/mail/mail_big_red.png);
            }
            
            /* ----- small */
            .iconButton:hover .small_mailIcon, 
            .iconButton .active .small_mailIcon {
                background-image: url(/images/buttons/mail/mail_small_blue.png);
            }
            .iconButton:hover .small_gray_mailIcon, 
            .iconButton .active .small_gray_mailIcon {
                background-image: url(/images/buttons/mail/mail_small_red.png);
            }
            .iconButton:hover .small_blue_mailIcon, 
            .iconButton .active .small_blue_mailIcon {
                background-image: url(/images/buttons/mail/mail_small_blue.png);
            }
            .iconButton:hover .small_red_mailIcon, 
            .iconButton .active .small_red_mailIcon {
                background-image: url(/images/buttons/mail/mail_small_red.png);
            }

        /*  ===== delete ===== */
        .iconButton .deleteIcon, 
        .iconButton .small_deleteIcon, 
        .iconButton .big_deleteIcon, 
        .iconButton .gray_deleteIcon,
        .iconButton .blue_deleteIcon,
        .iconButton .red_deleteIcon, 
        .iconButton .small_gray_deleteIcon,
        .iconButton .small_blue_deleteIcon,
        .iconButton .small_red_deleteIcon, 
        .iconButton .big_gray_deleteIcon,
        .iconButton .big_blue_deleteIcon,
        .iconButton .big_red_deleteIcon {
            background-image: url(/images/buttons/delete/delete_small_gray.png);
        }

            /* ----- big */
            .iconButton:hover .deleteIcon, 
            .iconButton .active .deleteIcon 
            .iconButton:hover .big_deleteIcon, 
            .iconButton .active .big_deleteIcon {
                background-image: url(/images/buttons/delete/delete_big_blue.png);
            } 

            .iconButton:hover .gray_deleteIcon, 
            .iconButton .active .gray_deleteIcon,
            .iconButton:hover .big_gray_deleteIcon, 
            .iconButton .active .big_gray_deleteIcon {
                background-image: url(/images/buttons/delete/delete_big_red.png);
            }
            .iconButton:hover .blue_deleteIcon, 
            .iconButton .active .blue_deleteIcon, 
            .iconButton:hover .big_blue_deleteIcon, 
            .iconButton .active .big_blue_deleteIcon {
                background-image: url(/images/buttons/delete/delete_big_blue.png);
            }
            .iconButton:hover .red_deleteIcon, 
            .iconButton .active .red_deleteIcon, 
            .iconButton:hover .big_red_deleteIcon, 
            .iconButton .active .big_red_deleteIcon {
                background-image: url(/images/buttons/delete/delete_big_red.png);
            }
            
            /* ----- small */
            .iconButton:hover .small_deleteIcon, 
            .iconButton .active .small_deleteIcon {
                background-image: url(/images/buttons/delete/delete_small_blue.png);
            }
            .iconButton:hover .small_gray_deleteIcon, 
            .iconButton .active .small_gray_deleteIcon {
                background-image: url(/images/buttons/delete/delete_small_red.png);
            }
            .iconButton:hover .small_blue_deleteIcon, 
            .iconButton .active .small_blue_deleteIcon {
                background-image: url(/images/buttons/delete/delete_small_blue.png);
            }
            .iconButton:hover .small_red_deleteIcon, 
            .iconButton .active .small_red_deleteIcon {
                background-image: url(/images/buttons/delete/delete_small_red.png);
            }

        /*  ===== shopping ===== */
        .iconButton .shoppingIcon, 
        .iconButton .small_shoppingIcon, 
        .iconButton .big_shoppingIcon, 
        .iconButton .gray_shoppingIcon,
        .iconButton .blue_shoppingIcon,
        .iconButton .red_shoppingIcon, 
        .iconButton .small_gray_shoppingIcon,
        .iconButton .small_blue_shoppingIcon,
        .iconButton .small_red_shoppingIcon, 
        .iconButton .big_gray_shoppingIcon,
        .iconButton .big_blue_shoppingIcon,
        .iconButton .big_red_shoppingIcon {
            background-image: url(/images/buttons/shopping/shopping_small_gray.png);
        }

            /* ----- big */
            .iconButton:hover .shoppingIcon, 
            .iconButton .active .shoppingIcon 
            .iconButton:hover .big_shoppingIcon, 
            .iconButton .active .big_shoppingIcon {
                background-image: url(/images/buttons/shopping/shopping_big_blue.png);
            } 

            .iconButton:hover .gray_shoppingIcon, 
            .iconButton .active .gray_shoppingIcon,
            .iconButton:hover .big_gray_shoppingIcon, 
            .iconButton .active .big_gray_shoppingIcon {
                background-image: url(/images/buttons/shopping/shopping_big_red.png);
            }
            .iconButton:hover .blue_shoppingIcon, 
            .iconButton .active .blue_shoppingIcon, 
            .iconButton:hover .big_blue_shoppingIcon, 
            .iconButton .active .big_blue_shoppingIcon {
                background-image: url(/images/buttons/shopping/shopping_big_blue.png);
            }
            .iconButton:hover .red_shoppingIcon, 
            .iconButton .active .red_shoppingIcon, 
            .iconButton:hover .big_red_shoppingIcon, 
            .iconButton .active .big_red_shoppingIcon {
                background-image: url(/images/buttons/shopping/shopping_big_red.png);
            }
            
            /* ----- small */
            .iconButton:hover .small_shoppingIcon, 
            .iconButton .active .small_shoppingIcon {
                background-image: url(/images/buttons/shopping/shopping_small_blue.png);
            }
            .iconButton:hover .small_gray_shoppingIcon, 
            .iconButton .active .small_gray_shoppingIcon {
                background-image: url(/images/buttons/shopping/shopping_small_red.png);
            }
            .iconButton:hover .small_blue_shoppingIcon, 
            .iconButton .active .small_blue_shoppingIcon {
                background-image: url(/images/buttons/shopping/shopping_small_blue.png);
            }
            .iconButton:hover .small_red_shoppingIcon, 
            .iconButton .active .small_red_shoppingIcon {
                background-image: url(/images/buttons/shopping/shopping_small_red.png);
            }
        /* ------------------------------------------------------------ */
            
        /*  ===== settings ===== */
        .iconButton .settingsIcon, 
        .iconButton .small_settingsIcon, 
        .iconButton .big_settingsIcon, 
        .iconButton .gray_settingsIcon,
        .iconButton .blue_settingsIcon,
        .iconButton .red_settingsIcon, 
        .iconButton .small_gray_settingsIcon,
        .iconButton .small_blue_settingsIcon,
        .iconButton .small_red_settingsIcon, 
        .iconButton .big_gray_settingsIcon,
        .iconButton .big_blue_settingsIcon,
        .iconButton .big_red_settingsIcon {
            background-image: url(/images/buttons/settings/settings_small_gray.png);
        }

            /* ----- big */
            .iconButton:hover .settingsIcon, 
            .iconButton .active .settingsIcon 
            .iconButton:hover .big_settingsIcon, 
            .iconButton .active .big_settingsIcon {
                background-image: url(/images/buttons/settings/settings_big_blue.png);
            } 

            .iconButton:hover .gray_settingsIcon, 
            .iconButton .active .gray_settingsIcon,
            .iconButton:hover .big_gray_settingsIcon, 
            .iconButton .active .big_gray_settingsIcon {
                background-image: url(/images/buttons/settings/settings_big_red.png);
            }
            .iconButton:hover .blue_settingsIcon, 
            .iconButton .active .blue_settingsIcon, 
            .iconButton:hover .big_blue_settingsIcon, 
            .iconButton .active .big_blue_settingsIcon {
                background-image: url(/images/buttons/settings/settings_big_blue.png);
            }
            .iconButton:hover .red_settingsIcon, 
            .iconButton .active .red_settingsIcon, 
            .iconButton:hover .big_red_settingsIcon, 
            .iconButton .active .big_red_settingsIcon {
                background-image: url(/images/buttons/settings/settings_big_red.png);
            }
            
            /* ----- small */
            .iconButton:hover .small_settingsIcon, 
            .iconButton .active .small_settingsIcon {
                background-image: url(/images/buttons/settings/settings_small_blue.png);
            }
            .iconButton:hover .small_gray_settingsIcon, 
            .iconButton .active .small_gray_settingsIcon {
                background-image: url(/images/buttons/settings/settings_small_red.png);
            }
            .iconButton:hover .small_blue_settingsIcon, 
            .iconButton .active .small_blue_settingsIcon {
                background-image: url(/images/buttons/settings/settings_small_blue.png);
            }
            .iconButton:hover .small_red_settingsIcon, 
            .iconButton .active .small_red_settingsIcon {
                background-image: url(/images/buttons/settings/settings_small_red.png);
            }
        /* ------------------------------------------------------------ */
        /*  ===== profile ===== */
        .iconButton .profileIcon, 
        .iconButton .small_profileIcon, 
        .iconButton .big_profileIcon, 
        .iconButton .gray_profileIcon,
        .iconButton .blue_profileIcon,
        .iconButton .red_profileIcon, 
        .iconButton .small_gray_profileIcon,
        .iconButton .small_blue_profileIcon,
        .iconButton .small_red_profileIcon, 
        .iconButton .big_gray_profileIcon,
        .iconButton .big_blue_profileIcon,
        .iconButton .big_red_profileIcon {
            background-image: url(/images/buttons/profile/profile_small_gray.png);
        }

            /* ----- big */
            .iconButton:hover .profileIcon, 
            .iconButton .active .profileIcon 
            .iconButton:hover .big_profileIcon, 
            .iconButton .active .big_profileIcon {
                background-image: url(/images/buttons/profile/profile_big_blue.png);
            } 

            .iconButton:hover .gray_profileIcon, 
            .iconButton .active .gray_profileIcon,
            .iconButton:hover .big_gray_profileIcon, 
            .iconButton .active .big_gray_profileIcon {
                background-image: url(/images/buttons/profile/profile_big_red.png);
            }
            .iconButton:hover .blue_profileIcon, 
            .iconButton .active .blue_profileIcon, 
            .iconButton:hover .big_blue_profileIcon, 
            .iconButton .active .big_blue_profileIcon {
                background-image: url(/images/buttons/profile/profile_big_blue.png);
            }
            .iconButton:hover .red_profileIcon, 
            .iconButton .active .red_profileIcon, 
            .iconButton:hover .big_red_profileIcon, 
            .iconButton .active .big_red_profileIcon {
                background-image: url(/images/buttons/profile/profile_big_red.png);
            }
            
            /* ----- small */
            .iconButton:hover .small_profileIcon, 
            .iconButton .active .small_profileIcon {
                background-image: url(/images/buttons/profile/profile_small_blue.png);
            }
            .iconButton:hover .small_gray_profileIcon, 
            .iconButton .active .small_gray_profileIcon {
                background-image: url(/images/buttons/profile/profile_small_red.png);
            }
            .iconButton:hover .small_blue_profileIcon, 
            .iconButton .active .small_blue_profileIcon {
                background-image: url(/images/buttons/profile/profile_small_blue.png);
            }
            .iconButton:hover .small_red_profileIcon, 
            .iconButton .active .small_red_profileIcon {
                background-image: url(/images/buttons/profile/profile_small_red.png);
            }
        /* ------------------------------------------------------------ */


.viewBox {
    padding: 40px;
    background: url(/images/views/contentbox_backgr.png) top left repeat-x;
}

.viewHead {
}
    .viewHead .columnRight {
        width: 310px;
        margin-top: 30px;
    }
        .viewHead .columnRight .StWrapper {
            margin-left: 40px;
        }
            .viewHead .columnRight .StyleWheelBox {
                margin: 0 auto;
            }
    .viewHead .columnMiddle {
        margin-right: 0px;
    }
        .viewHead .columnMiddleContent {
            margin-top: 30px;
        }

        .viewHead .columnRight h1,
        .viewHead .columnMiddle h1 {
            margin-top: -30px;
        }
        .viewHead .columnRight h1 {
            margin-left: 40px;
        }
        /*.viewHead .columnMiddle h2 {*/
            /*margin-left: 60px;*/
            /*font-size: 11px;*/
            /*margin-top: -1em;*/
            /*font-weight: normal;*/
        /*}*/

        .viewHead .columnMiddle .viewHeadContent {
            margin-top: 30px;
        }

.viewContent {
}
    .viewContent .tcWrapper {
        margin-top: 20px;
    }
        .viewContent .columnRight {
        }

.creditBox {
    padding: 5px;
    margin-top: 25px;
    font-size: 10px;
    background: url(/images/views/boxgradient.png) top left repeat-x;
    /*float: left;*/
}
    .creditBox .creditLogo {
        /*margin-left: 5px;*/
        float: left;
    }
    .creditBox .creditText {
        margin-left: 60px;
        line-height: 150%;
    }
        .creditBox a {
            color: white;
            text-decoration: underline;
        }

.contextbox {
    display: none;
    z-index: 1000;
    position: absolute;
    width: 223px;
}
    .contextbox .top {
        height: 35px;
        background: url(/images/views/contextbox_top.png) top center no-repeat;
    }
    .contextbox .middle {
        background: url(/images/views/contextbox_middle.png) top center repeat-y;
    }
        .contentBlock {
            margin: 0px 10px;
        }
    .contextbox .bottom {
        height: 10px;
        background: url(/images/views/contextbox_bottom.png) top center no-repeat;
    }


.viewBox .viewHead .columnMiddle .picBox {
}
        .viewBox .viewHead .columnMiddle .picBox .bigPicWrapper {
            height: 170px;
            width: 170px;
            overflow: hidden;
            float: left;
            text-align: center;
            position: relative;
        }
            .viewBox .viewHead .columnMiddle .picBox .bigPicWrapper img {
                height: 100%;
            }
            .viewBox .viewHead .columnMiddle .picBox .bigPicWrapper .albumOverlay {
                height: 100%;
                width: 100%;
                background: url(/images/songBadge/album170x150.png) top left no-repeat;
                position: absolute;
                top: 0px;
                left: 0px;
            }

        .viewBox .viewHead .columnMiddle .picBox .buttonBox,
        .viewBox .viewHead .columnMiddle .picBox .picList {
            width: 120px;
            margin-left: 180px;
        }
            .viewBox .viewHead .columnMiddle .picBox .picList .noPic,
            .viewBox .viewHead .columnMiddle .picBox .picList .thumbnailWrapper {
                float: left;
                width: 50px;
                height: 50px;
                margin: 0 10px 10px 0;
                overflow: hidden;
                text-align: center;
            }
            .viewBox .viewHead .columnMiddle .picBox .picList .noPic {
                border: 1px solid #333;
                margin: 0 8px 8px 0;
            }
            .viewBox .viewHead .columnMiddle .picBox .picList .thumbnailWrapper img {
                height: 100%;
            }

        .viewBox .viewHead .columnMiddle .picBox .buttonBox .button {
        }


.ticketsearch {
    width: 126px;
    height: 22px;
    background: url(/images/views/ticketsearch.png) top left no-repeat;
    text-align: center;
    color: white;
    padding-top: 30px;
}
    .ticketsearch div {
        margin: 0 auto;
    }


.tabBox {
    border-bottom: 1px solid #1b1b1b;
    margin-bottom: 10px;
}
*+html .tabBox {
    width: 100%;
}

    .tabBox .tab {
        height: 20px;
        float: left;
        padding-left: 5px;
        line-height: 20px;
        vertical-align: middle;
        margin-bottom: -1px;
    }
        .tabBox .tab .right {
            padding-right: 5px;
        }
            .tabBox .tab .text{
                padding: 0 5px;
            }
    .tabBox .activeTab {
        background: url(/images/views/tabbutton_left.png) top left no-repeat;
        color:white;
    }
        .tabBox .activeTab .right {
            background: url(/images/views/tabbutton_right.png) top right no-repeat;
        }
            .tabBox .activeTab .text {
                background: url(/images/views/tabbutton_tile.png) top left repeat-x;
            }

    .tabBox_content .tab_content {
        display: none;
        visibility: hidden;
    }

    .tabBox_content .tab_content .yt_thumbnail {
        width: 80px;
        margin: 0 5px 5px 0;
    }

/* artist view  -------------------------------------------------- */

#ArtistView {
}

    #artistImageUploadBox.contextbox .middle .contentBlock {
        font-size: 9px;
    }
        #artistImageUploadBox.contextbox .middle .topText {
            margin-bottom: 5px;
        }
        #artistImageUploadBox.contextbox .middle .form {
            display: block;
            margin: 0 auto;
        }

            #artistImageUploadBox.contextbox .middle .inputOkBox .inputOk_input {
                width: 145px;
            }
        #artistImageUploadBox.contextbox .middle .contentBlock .flickrBlock {
            font-size: 8px;
            margin-top: 5px;
        }
            #artistImageUploadBox.contextbox .middle .contentBlock .flickrBlock img {
                float: left;
                margin-right: 5px;
            }
            #artistImageUploadBox.contextbox .middle .contentBlock .flickrBlock a {
                text-align: right;
                float: right;
                width: 120px;
            }


    #ArtistView .viewContent .tcWrapper {
        margin-top: 10px;
    }
        #ArtistView .viewContent .columnRight {
            width: 300px;
            margin-left: 40px;
        }
        #ArtistView .viewContent .columnMiddle {
        }


/* Album view ---------------------------------------- */

#AlbumView {
}
    #AlbumView .viewHead .columnMiddle .picBox {
        position: relative;
    }
        #AlbumView .viewHead .columnMiddle .picBox .bigPicWrapper {
            height: 150px;
            text-align: right;
        }
        #AlbumView .viewHead .columnMiddle .picBox .buttonBox {
            margin-left: 200px;
        }
        #AlbumView .viewHead .columnMiddle .picBox .lastButton {
            position: absolute;
            bottom: 0px;
        }

    #AlbumView .viewContent {
        margin-top: 40px;
    }
        #AlbumView .resultList li.result div.entry {
            width: 33%;
        }


/* UserProfile ---------------------------------------- */

#UserProfile .songBadge {
    float: left;
}
    #UserProfile .songBadge .avatar {
        display: none;
    }
#UserProfile .friends .userBadge {
    margin-bottom: 20px;
}

/* Impressum, TOS,etc ---------------------------------------- */

#impressum h2 {
    margin:0px;
    margin-top:20px;
}

#impressum p {
    color:#DDD;
}


/* Styles --------------------------------------------- */
#styleDiscription {
    font-size: 1.1em;
    text-align: justify;
    line-height: 150%;
}
#styleDiscription h2 {
    margin: 20px 0 -5px 0;
}
#styleDiscription {
    color: #ddd;
}


#tagwheel {
	 width: 142px;
	 height: 142px;
	 background: url(/images/tagwheel.png);
	 position: relative;
	 /*border:1px solid green;*/
}

#wheelstationname {
	font: 9px Helvetica;
	font-weight:normal;
	position:absolute;
	left:0px;
	top:0px;
	line-height:9px;
}

#tagstation1,
#tagstation2,
#tagstation3,
#tagstation4,
#tagstation5,
#tagstation6,
#tagstation7,
#tagstation8 {
    /*overflow:hidden;*/
    padding:2px;
     /*position:inherit;*/
    position: absolute;
    /*width:50px;*/
    /*background:inherit;*/
}

    #tagstation1 a,
    #tagstation2 a,
    #tagstation3 a,
    #tagstation4 a,
    #tagstation5 a,
    #tagstation6 a,
    #tagstation7 a,
    #tagstation8 a {
        z-index: 10;
        position: relative;
        color: black;
    }

    #tagstation1.active a,
    #tagstation2.active a,
    #tagstation3.active a,
    #tagstation4.active a,
    #tagstation5.active a,
    #tagstation6.active a,
    #tagstation7.active a,
    #tagstation8.active a {
        font-weight: bolder;
    }
    #wheelstationname .stationName .background {
        position: absolute;
        top: 0px;
        left: 0px;
        width: 100%;
        height: 100%;
        background: white;
        opacity:0.75;
        filter:alpha(opacity=70);
        z-index: 0;
    }

#tagstation1,
#tagstation2,
#tagstation3,
#tagstation4 {
    text-align:left;
}
#tagstation5,
#tagstation6,
#tagstation7,
#tagstation8 {
    text-align:right;
}
#tagstation1 {left:88px;top:36px; max-width: 70px;}
#tagstation2 {left:105px;top:54px; max-width: 52px;}
#tagstation3 {left:107px;top:78px; max-width: 51px;}
#tagstation4 {left:90px;top:95px; max-width: 70px;}
#tagstation5 {right:-50px;top:95px; max-width: 58px;}
#tagstation6 {right:-33px;top:78px; max-width: 41px;}
#tagstation7 {right:-33px;top:54px; max-width: 41px;}
#tagstation8 {right:-50px;top:36px; max-width: 58px; }


#teaserBox1 {
    height: 280px;
    position: relative;
    background: url(/images/teaser/teaserback.png) top left repeat-x;
}
    #teaserBox1 #teaserSteps {
        position: relative;
        height: 280px;
        margin: 0px auto;
    }
    html>body #teaserBox1 #teaserSteps {
        width: 760px;
        white-space: nowrap;
    }
    * html #teaserBox1 #teaserSteps {
    }
    #teaserBox1 #teaserSteps img {
        /*display: none;*/
    }
    #teaserStep1 {
        position: absolute;
        top: 0px;
        left: 0px;
    }
    #teaserStep2 {
        position: absolute;
        top: 0px;
        left: 240px;
        /*margin-left: -1px;*/
    }
    #teaserStep3 {
        position: absolute;
        left: 500px;
        top: 0px;
        /*right: 0px;*/
        /*margin-left: -1px;*/
    }

    #teaserBox1 a {
        position: absolute;
        right: 15px;
        bottom: 15px;
    }
    /*#teaserBox1 a {*/
        /*position: absolute;*/
        /*display: block;*/
        /*background: url(/images/teaser/button_blue.png) center no-repeat;*/
        /*right: 132px;*/
        /*bottom: 42px;*/
        /*width: 90px;*/
        /*height: 20px;*/
        /*line-height: 20px;*/
        /*text-align: center;*/
        /*vertical-align: middle;*/
        /*font-size: 11px;*/
        /*color: #B5B5B5;*/
    /*}*/
    /*#teaserBox1 a:hover  {*/
        /*background: url(/images/teaser/button_blue_sel.png) center no-repeat;*/
        /*color: white;*/
    /*}*/

#teaserBox2 {
} 
    #teaserBox2 .contentBox {
        padding: 10px;
        /*background: url(/images/teaser/frontpagecharts_backgr.png) top left repeat-x;*/
        height: 365px;
    }
    #teaserBox2 .teaserTitle{
        height: 45px;
        padding: 5px 0 0 5px;
        font-size: 16px;
        font-weight: bold;
    } 
    #teaserBox2 .teaserContent{
        height: 315px;
        position: relative;
    }
        #teaserBox2 .columnMiddle .teaserContent {
            height: 325px;
        }
        #teaserBox2 .contentBox .resultListing {
            bottom:5px;
            left:10px;
            position:absolute;
            width:210px;
        }
            #teaserBox2 .contentBox .resultListing li {
                margin-bottom: 5px;
            }
            *+html #teaserBox2 .contentBox .resultListing li {
                margin-bottom: 1px;
            }
    
    #teaserBox2 .toptagger {
        margin-bottom:18px;
        margin-left:10px;
        margin-top:-10px;
        position: relative;
        width: 211px;
    }
    #teaserBox2 .toptagger .tendenz {
        position: absolute;
        right: 0px;
        top: 5px;
        height: 68px;
        width: 60px;
        background: url(/images/userBadge/user_tendenz.png) right top no-repeat;
    }
        #teaserBox2 .toptagger .tendenz_up,
	    #teaserBox2 .toptagger .tendenz_gleich,
        #teaserBox2 .toptagger .tendenz_down {
            font-size: 8px;
            position: absolute;
            width: 48px;
            height: 32px;
            padding-top: 32px;
            right: 2px;
            top: 2px;
            text-align: center;
            color: #666;
        }
        #teaserBox2 .toptagger .tendenz_up {
            background: url(/images/userBadge/tendenz_up.png)  center 10px no-repeat;
        }
        #teaserBox2 .toptagger .tendenz_down {
            background: url(/images/userBadge/tendenz_down.png) center 10px no-repeat;
        }
        #teaserBox2 .toptagger .tendenz_gleich {
            background: url(/images/userBadge/tendenz_gleich.png) center 10px no-repeat;
        }
        #teaserBox2 .toptagger .tendenz .platz {
            font-size: 13px;
            font-weight: bold;
        }


