﻿#top_container
{
    margin-left:auto;
    margin-right:auto;
    
    width: 950px;   
}

.cen_box
{
    width: 550px;
    margin-lefT:auto;
    margin-right:auto;
}

/* header */
.main_header
{
    position:relative;
    direction: ltr; 
        
    height: 103px;
    background-color: black;
    background-image:   url('../images/ui/blackground.png');
    background-position: top;
    background-repeat: repeat-x;
    
    color:White;
    
    -moz-border-radius-bottomleft: 13px;
    -moz-border-radius-bottomright: 13px;
    -webkit-border-bottom-right-radius: 13px;
    -webkit-border-bottom-left-radius: 13px;
}
    .main_header_contents
    {
    
        
    }

    .main_header img.logo
    {
        position:absolute;
        top: 13px;
        left: 25px;
    }
    .main_header a
    {
        color: #808080;
        padding: 0 0 0 0;
        margin: 0 0 0 0;
        text-decoration:none;
    }
    .main_header a:hover
    {
        color: White;
        /*text-decoration: underline;*/
    }
    .main_header #corner_box
    {
        position:absolute;
        top: 0px;
        right: 32px;
    }

    /* header orange buttons */
    .main_header #corner_box a
    {
        color: #454545;
    
        width: 93px;
        height: 21px;
        display:inline-block;
        text-align:center;
        
        margin-left: 0px;
        
        background-position: center top;
        background-repeat: no-repeat;
        
        padding-top: 3px;
    }
        .main_header #corner_box a:hover
        {
            color:White;
            text-decoration: none;
        }
        .main_header #corner_box a.join  { background-image: url(../images/ui/btnOrange1.png);}
        .main_header #corner_box a.login { background-image: url(../images/ui/btnOrange2.png);}
        .main_header #corner_box a.logout 
        { 
            color: #808080;
            display:inline-block;
            
            
            margin-right: 7px;
            width: auto;
        }

.main_header #links ul
{
    position:absolute;
    top: 76px;
    right: 13px;
    direction: rtl;
}
    .main_header #links ul li
    {
        display:inline;
        list-style-type: none;
        padding: 0 12px 0 12px;
        
        border-right: solid 1px #565656;
    }
    
    
        .main_header #links ul li.first
        { 
			border-right: none; 
		}
        
        .main_header #links ul li strong
        {
            
        }
        

/* content + sub_header */
#main_middle
{
    margin-top: 7px;
    min-height: 490px;
    margin-bottom: 0px;
}


/* inner pages: the 'hello username' personal part: */
.sub_header
{
    display:block;
    height: 102px;
    
    margin-bottom: 10px;
    
    background-image: url(../images/ui/grad_small2.gif); /* overriding .box background */
    background-position: bottom;
    background-color:White;
    position:relative;
    
    direction:ltr;
    border: solid 1px #DEDEDE;
    -moz-border-radius:5px;
    -webkit-border-radius:5px;
    
    padding-bottom: 0px; /* box background fix: */
    
    z-index: 10;
    
}
    .sub_header.artist
    {
        
        height: 96px;
        background-color: #ECECEC;        
        background-position: top;
    }
    /*Dan 26aug10: artists new header */
    .sub_header.artistNew
    {    
        height : 120px;        
    }

    .sub_header #userInfo
    {
        position:absolute;
        top: 14px;
        right: 4px;
        margin-right:20px;
    }
        .sub_header #userInfo #userWelcome
        {
            display:inline;
            font-size: 15px;   
            font-weight:bold;
            color: #888888;
        }
        .sub_header #userInfo a
        {
            
        }
    
    .sub_header .bottom_link /*used for "return to my artists" link */
    {
        display:block;
        margin-top: 17px;
    }
        
    .sub_header .search_box
    {
        position: absolute;
        text-align:left;
        top: 10px;
        left: 10px;
    }
    
    
    /* broadcaster menu */
    .sub_header .broad_nav
    {
        position:absolute;
        top: 58px;
        right: -1px;
        
        height: 36px;
        
        padding-top: 4px;
        padding-right: 15px;
        
        width: 935px;
        
        background-image: url('../images/ui/tab_background.png');
        background-repeat: repeat-x;
        background-position: bottom;
    }
        .sub_header.artistNew .broad_nav
        {
            top: 76px;
        
        }
    
    .sub_header .broad_nav ul
    {
    }
        .sub_header .broad_nav ul li
        {
            display:inline;
        }
            .sub_header .broad_nav ul li a
            {
                display:inline-block;
                color:White;
                text-decoration:none;
                
                padding-top: 14px;
                height: 37px;
                
                margin-left: 14px;
                margin-right: 18px;
                text-align:center;
            }
            .sub_header .broad_nav ul li a span
            { 
                padding-top: 1px;
            }
                .sub_header .broad_nav ul li a.selected
                {
                    
                    color:Black;
                    width: 112px;
                    background-image: url('../images/ui/tab_selected.png');
                    background-repeat: no-repeat;
                    background-position: center -1px;
                }
                
            .sub_header .broad_nav ul li a:hover
            {
                color: #7FB4FF;
                text-decoration:none;
            }
            
        .sub_header .broad_nav ul li.anana_tab a
        {
            
        }
        
        .sub_header .broad_nav ul li.anana_tab a span
        {
            
            display:inline-block;
            background: url('/static/images/ui/anana_off.png') no-repeat  left top;
            width: 70px;
            height: 19px; 
        }
            .sub_header .broad_nav ul li.anana_tab a:hover span
            {
                background-image: url('../images/ui/anana_hover.png');
                
            }
            .sub_header .broad_nav ul li.anana_tab a.selected
            {
                background-position: center 0px;
            }
                .sub_header .broad_nav ul li.anana_tab a.selected span
                {
                
                    background-image: url('../images/ui/anana_on.png');
                }
            
            
    /* broadcaster playlists */
    .sub_header .broad_nav .playlist_select
    {
        font-size: 14px;
        position: absolute;
        top: 16px;
        left: 5px;
        
        height: 20px;

        padding: 4px 13px 0px 13px;
        
        background:Black;
        color:White;
    }
        .sub_header .broad_nav .playlist_select a
        {
            color:White;
            text-decoration: none;
        }
    
    
    .playlist_select_inner
    {
        position:absolute;
        top: 24px;
        left: 0px;
        
        min-width: 180px;
        
        padding: 5px 5px 0px 5px;
        
        border: solid 1px #cacaca;
        color: Black;
        
        background:white;
        
        display:none;
        
        max-height: 300px;
        overflow:auto;
        
        z-index: 10;
    }
        .playlist_select_inner .no_playlists_notice
        {
            color: #989898;
        }
        .playlist_select_inner ul 
        {
			margin: 0 0 0 0;
			padding: 0 0 0 0;
			width: 190px;
        }
        
        .playlist_select_inner ul li 
        {
            display:block !important;
            
            height:auto;
            margin: 0 0 0 0;
            padding: 4px 0 4px 0;    
            
            border-top: solid 1px #ababab;
        }
            .playlist_select_inner ul li.first
            {
				border-top: none;
				padding-top: 1px;
            }
        
            .playlist_select_inner ul li a 
            {
                text-align:right !important;
                display:block;
                
                height: auto !important;
                width: 155px;
                
                color: #989898 !important;
                font-weight:bold !important;
                
                padding: 1px 2px 1px 0 !important;
            }
            .playlist_select_inner ul li a:hover
            {
                color: #f7941d !important;
                /*background: #4455AA;*/
                background: #DFDFEF;
                
            }
    /* broadcaster "remember" section */
    .remember_me
    {
        display:block;
        padding: 0 0 0 0;
        
        direction:ltr;
        border: solid 1px #DEDEDE;
        -moz-border-radius:7px;
        -webkit-border-radius:7px;
        
        height: 70px;
        margin-top: 28px;
        /*margin-bottom: 17px;*/
        margin-bottom: 1px;
        
        background-image: url(../images/ui/grad_small.gif);
        background-repeat: repeat-x;
        background-position: bottom;
        /*background-color: #ECECEC;*/
        background-color:White;
        
        z-index: 5;
        position:relative;
        
    }
        .remember_me .inner_div
        {
            direction: rtl;
            text-align:right;
            
            text-align:center;
            width:auto;
        }
        .remember_me #remember_top
        {
            position:absolute;
            
            padding-top:2px;
            direction:rtl;
            text-align:center;
            
            height: 19px;
            width: 96px;
            
            left:18px;
            top: -19px;
            
            color:White;
            
            background-image:url('../images/ui/remember_top.png');
            background-repeat: no-repeat;
            background-position: top right;
        }
        
            .remember_me .inner_div ul
            {
                text-align:right;
                display:inline-block;
            }
        
            .remember_me .inner_div li
            {
                background-image:url('../images/ui/sep_tall.png');
                background-repeat: no-repeat;
                background-position: right;
                
                height: 70px;
                
                padding-right: 30px;
                
                width: 205px;
                
                /*display:inline-block;*/
                display: table-cell;
                
                vertical-align: middle;
                float:right;
            }
                .remember_me .inner_div li.first
                {
					clear:left;
                    background-image: none;
                }             
                .remember_me .inner_div li a
                {
                    color: #404040;

                    display:inline-block;
                    margin-top: 8px;
                    
                    position:relative;
                    width: 200px;
                    
                    cursor:pointer;
                }
					.remember_me .inner_div li a img
					{
						width:55px;
						height: 55px;
						
						position:absolute;
						top:0px;
						right: 0px;
					}
					
					.remember_me .inner_div li a .details
					{
						display: inline;
	                    	                    
						padding-top: 1px;
						padding-right: 7px;
						
	                    
						height: 55px;

						vertical-align: middle;
						
						position:absolute;
						top:0px;
						right:59px;
					}
						.remember_me .inner_div li a .details h4
						{
							display:inline-block;
							font-size: 13px;
							color: Black;
							margin-bottom: 2px;
							padding-top: 4px;
							
							max-width: 140px;
							white-space: nowrap;  
							overflow: hidden;  
							text-overflow: ellipsis;  
						}
						
						.remember_me .inner_div li a .details span
						{
							display:block;  
	                        
							max-width: 140px;
							white-space: nowrap;  
							overflow: hidden;  
							text-overflow: ellipsis;  
						}
					
                
                    
                    .remember_me .inner_div li span
                    {
                        font-size: 13px;
                        color: #787870;
                    }
                    .remember_me .inner_div li span.time
                    {
                        margin-top: 3px;
                        font-size: 10px;
                        color:Black;
                    }
                    
                    
                    .remember_me .inner_div li a:hover,
                    .remember_me .inner_div li a:hover h4,
                    .remember_me .inner_div li a:hover span
                    {
                        color: #7FB4FF !important;
                    }
                
                
                
                
            
            
    /* artist icons */
    .sub_header ul.icons_nav
    {
        position:absolute;
        left: 7px;
        top: 20px;
        width: 575px;
    }
    .sub_header.artistNew ul.icons_nav
    {
        top: 17px;
    } 
        
        .sub_header ul.icons_nav li
        {
			display:block;
            float: right;
            margin-left: 16px;
            text-align:center;
            border-right: solid 1px #cccccc;
            padding-right: 16px;
            
            width: 110px;
        }
        
        .sub_header ul.icons_nav li.first
        {
            border-right: none;
            clear:left;
        }
        
        .sub_header ul.icons_nav li a
        {
            font-weight:bold;
            color: #7D7D7D;
            text-decoration:none;
        }
            .sub_header ul.icons_nav li a:hover
            {
                color: #5FB4DD;
            }
            .sub_header ul.icons_nav li a img 
            {
                display:block;
                margin-left:auto;
                margin-right:auto;
            }
            
.search_box_for_artist
{
    text-align:left;
    margin-bottom: 20px;
    
}



.main_footer
{
    margin-top: 35px;
    clear:both;
}   

/* boxes - footer */
.main_footer .box
{
    direction:ltr;
    height: 78px;
    
}

.main_footer .footer_contents
{
    padding-left: 15px;
    padding-top: 20px;
    display:block;
    
    width: 100%;
    height: 100%;
    position: relative;
}
.main_footer .box .copyright
{
    font-size: 12px;
    color: #898989;
    
    position:absolute;
    top: 34px;
    left: 15px;
}
    .main_footer .copyright a 
    {
        color: #898989;
        text-decoration: none;
    }
        .main_footer .copyright a:hover
        {
            text-decoration:underline;
        }



.main_footer .box ul.icons
{
    position:absolute;
    top:27px;
    right: 35px;
}
    .main_footer .box ul.icons li
    {
        display:inline;
        margin-right: 11px;
        padding-right: 13px;
        border-right: solid 1px silver;
    }
.main_footer .box ul.icons li.last{ border-right:none; margin-right: 0px; padding-right: 0px; }


/* outer page template */
#side_space
{
    display:inline-block;
    width: 286px;
    min-height: 530px;
    background-image: url('../images/ui/side_shadow.png');
    background-repeat: no-repeat;
    background-position: left 20px;
    float:right;
}
    #side_space img.side_img
    {
        margin-top: 20px;
        margin-right: 20px;
    }


#main_space
{
    display:inline-block;
    width: 640px;

    min-height: 490px;
    color: #707070;

    padding-right: 15px;   
    margin-bottom: 40px;
    
}
#main_space p
{
    font-size: 13px; 

}

#bottom_slidebox
{
	height: 36px; 
	bottom: -71px;
	width: 100%; 
	
	color:White;
	
	position:fixed;	
	left: 0;
	
	opacity: .95; 
	/* For IE 5-7 */
	filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=95);
	/* For IE 8 */
	-MS-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=95)";
	
	z-index: 400
}

    /*#bottom_slidebox #chupchik
    {
        display:inline-block;
        width: 145px;
        height:28px;
        
        background-image: url(../images/ui/bottom_slider_top.png);
        background-repeat: no-repeat;
        background-position: top right;
        
        padding-right: 33px;
        
        padding-bottom:0px;
        margin-bottom:0px;
        margin-right: 80px;
    }
        #bottom_slidebox #chupchik a
        {
            cursor:pointer;
        
            padding-top: 6px;
            padding-right: 27px;
            padding-bottom: 2px;
            color:White;
            
            background-repeat:no-repeat;
            background-position: right 4px;
        }
            #bottom_slidebox #chupchik a.open_link { display:inline-block; background-image: url('../images/icons/rnd_small_add.png');}
            #bottom_slidebox #chupchik.is_open a.open_link { display:none; }
            
            #bottom_slidebox #chupchik a.close_link {display:none }
            #bottom_slidebox #chupchik.is_open a.close_link { display:inline-block; background-image: url('../images/icons/rnd_small_sub.png');}
        */
    #bottom_slidebox.hidden_player 
    {
        height: 63px;
    }
        #bottom_slidebox.hidden_player #chupchik
        {
            display:none;
        }
        
    #bottom_slidebox #slidebox_contents
    {
        background-color: #333132;
        
        /* background-image: url('../images/ui/bottom_slider_back.png');
        background-repeat: repeat-x;*/
        
        display:block;
        height: 71px;
        
        padding-top:0px;
        margin-top:0px;
        
        text-align:center;
    }

