body{margin:0px;background:#c86498;background-imagek: linear-gradient(to right, #8a0d55 , #FF76C3);}

.div_ad
{
float:left;width:96%;height:300px;margin-left:2%;margin-bottom:20px;displayk:none;
}
.main_home_div
{
float:left;width:100%;height:60px;position:fixed;border-right:1px solid #ededed;
background-image: linear-gradient(to right, #DAF7A6, #FF76C3);
box-shadow: rgba(0, 0, 0, 0.45) 0px 25px 20px -20px;
}
.positioning_div{float:left;width:100%;height:60px;margin-bottom:20px;}
.main_header_div
{
float:left;width:100%;height:60px;backgroundk:#ccc;
}
.main_home_title
{
float:left;max-width:40%;height:40px;line-height:40px;margin-left:5%;font-size:1.2em;font-weight:bold;color:#000;backgroundk:pink;	
}
.coblaa_log_img
{
float:left;width:40px;height:40px;margin-top:10px;margin-left:2%;border-radius:50%;
}
.sitat_sear_icon
{
float:right;width:40px;height:40px;margin-top:10px;margin-right:4%;
}
.menu_icon
{
float:right;width:40px;height:40px;margin-top:10px;margin-right:2%;	
}
.notfi_count
{
float:right;width:50px;height:30px;line-height:30px;margin-top:-40px;background:#fff;text-align:center;font-weight:bold;color:red;border-radius:50%;
cursor:pointer;
}
.disp_notf_span
{
float:right;width:60px;height:40px;margin-right:3%;margin-top:10px;display:none;	
}
.notf_icon
{
float:right;width:40px;height:40px;margin-right:4%;
}


.main_search_div
{
float:right;width:70%;height:40px;margin-right:5%;margin-top:10px;background:#fcf6fb;border-radius:20px;display:none;
}
.ser_input
{
float:left;width:80%;height:35px;line-height:40px;background:#fcf6fb;text-align:center;border:0px;outline:none;font-size:1em;
}
.clear_main_ser_btn
{
float:left;width:40px;height:40px;background:#fff;border-radius:20px 0 0 20px;border:0px;outline:none;cursor:pointer;font-size:1.1em;font-weightk:bold;		
}
.main_ser_btn
{
float:right;width:40px;height:40px;background:#fff;border-radius:0 20px 20px 0;border:0px;outline:none;cursor:pointer;font-size:1.1em;font-weightk:bold;		
}
.search_result
{
float:right;width:70%;height:500px;margin-right:5%;margin-top:5px;background:#fff;border-bottom:1px solid #ccc;border-left:1px solid #ccc;border-right:1px solid #ccc;
border-radius:10px;display:none;overflow:auto;
}
.song_title_search
{
float:left;width:100%;height:40px;line-height:40px;text-align:center;border-bottom:1px solid #ccc;cursor:pointer;backgroundk:green;	
}
.art_name_search
{
float:left;width:50%;height:40px;line-height:40px;border-bottom:1px solid #ccc;cursor:pointer;	
}

.menu_shell_div
{
float:left;min-width:160px;width:16%;height:100%;margin-top:60px;position:fixed;background:green;
}
.menu_div
{
float:left;widthk:150px;width:100%;height:100%;background:#DAF7A6;border-right:1px solid #ccc;overflow:auto;	
}
.menu_clocing_div{display:none;}
.menu_btn
{
float:left;width:90%;height:40px;margin-left:6%;margin-top:20px;cursor:pointer;outline:none;
border-radius:20px;color:#000;	
}
.menu_btn_icon
{
float:left;width:35px;height:35px;
}
.menu_btn_lebal
{
float:left;widthk:70%;height:40px;margin-left:3%;font-weight:bold;background:transparent;border:0px solid #ccc;outline:none;color:#505252;font-size:0.8em;
cursor:pointer;	
}
.menu_btn_lebal:hover
{
font-size:0.9em;color:#800000;
}

.profile_div
{
float:left;width:100%;height:70px;backgroundk:red;border-bottom:1px solid #ccc;	
}
.profile_usr_name
{
float:left;width:50%;height:70px;line-height:70px;margin-left:2%;color:#505252;font-weight:bold;
}
.profile_img
{
float:left;width:40px;height:40px;margin-top:15px;margin-left:2%;border-radius:50%;
}

.main_header_title
{
float:left;width:100%;height:60px;line-height:60px;margin-leftk:3%;margin-bottom:0px;margin-top:30px;color:#800000;font-size:1.6em;font-family: serif;font-weight:bold;background:#fff;
text-align:center;border-radius:10px 10px 0 0;
}
.category_div
{
float:left;width:100%;height:100px;margin-top:5px;background:#fff;display:flex;justify-content:space-between;align-items:center;border-radius:20px;	
}
.sub_category
{
float:left;width:70px;height:90px;backgroundk:red;border-radiusk:50%;text-align:center;font-weight:bold;	
}
.cat_icon_span
{
float:left;width:70px;height:70px;border-radius:50%;background:#fff;display:flex;justify-content:center;align-items:center;	
}
.cat_icon_img
{
float:left;width:50px;height:50px;border-radius:50%;
}
.cat_icon_name
{
float:left;width:70px;height:20px;line-height:20px;text-align:center;font-size:0.9em;color:#525050;font-weight:bold;backgroundk:pink;	
}

.trend_play_icon_img
{
float:right;width:30px;height:30px;margin-right:3%;margin-right:10px;cursor:pointer;		
}
.trend_song_title
{
float:left;width:96%;height:30px;line-height:30px;margin-left:1%;margin-bottomk:6px;font-size:1em;text-align:center;font-weight:bold;color:#151517;
overflow: hidden;white-space: nowrap;text-overflow: ellipsis;backgroundk:red;	
}
.trend_song_artis
{
float:left;width:94%;height:30px;line-height:30px;margin-left:3%;font-size:0.9em;text-align:center;font-weight:bold;color:#d62d89;		
overflow: hidden;white-space: nowrap;text-overflow: ellipsis;backgroundk:purple;
}
.card_div
{
float:left;width:100%;height:auto;margin-bottom:30px;margin-topk:0px;background:#fff;border-radius:0 0 10px 10px;
  display: flex;
  flex-wrap: wrap;
justify-content: space-around;
   
}
.single_trend_div
{
float:left;width:180px;height:260px;margin-leftk:10px;margin-bottom:15px;margin-top:15px;background:#fff;border-radius:10px;	
box-shadowk: rgba(0, 0, 0, 0.25) 0px 54px 55px, rgba(0, 0, 0, 0.12) 0px -12px 30px, rgba(0, 0, 0, 0.12) 0px 4px 6px, rgba(0, 0, 0, 0.17) 0px 12px 13px, rgba(0, 0, 0, 0.09) 0px -3px 5px;
box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;text-decoration:none;
}
.single_trend_div:hover{border:1px solid #acfa79;background:#ededed;}
.single_trend_div:active{border:1px solid #fa6388;}
.trend_img_div
{
float:left;width:180px;height:180px;margin-leftk:1%;display:flex;justify-content:center;align-items:center;backgroundk:red;border-radius:10px 10px 0 0;	
}
.trend_img
{
float:left; width:99%;height:99%;border-radius:10px 10px 0 0;
}
.play_icon_span
{
float:right;width:40px;height:40px;margin-top:-50px;margin-right:5%;border-radius:50%;display:flex;justify-content:center;align-items:center;		
background-image: linear-gradient(to right, #fff, #fff);
}
.play_icon_span:hover{background-image: linear-gradient(to right, #FF76C3, #DAF7A6);}
.play_icon
{
width:20px;height:20px;
}

.cb_preloader
{
width:100%;height:100vh;position:fixed;z-index:100;display:flex;justify-content:center;align-items:center;
background-image: linear-gradient(to right, #8a0d55 , #FF76C3);	
}
.cb_preloader_img
{
width:200px;height:200px;border-radius:50%;
}

.bilboard_div
{
float:left;width:100%;height:300px;margin-top:0px;background:#363536;border-radius:0 0 20px 20px;
box-shadow: rgba(0, 0, 0, 0.35) 0px -50px 36px -28px inset;	
display:flex;justify-content:center;align-items:center;
}
.bilboard_img
{
max-width: 100%;height:auto;max-height:90%;transition: width 2s;	
}
.helping_input{display:none;}



.cb_live_board
{
float:left;width:100%;backgroundk:#363536;margin-top:20px;border-radiusk:0 0 20px 20px;
box-shadow: rgba(0, 0, 0, 0.35) 0px -50px 36px -28px inset;display:flex;align-items:center;
overflow-x:auto;overflow-x:hidden;	
}
.single_ad_div
{
float:left;min-width:200px;heightk:280px;margin:10px;margin-bottomk:50px;background:#fff;border-radius:20px;	
}
.icon_img
{
float:left;width:120;height:120px;margin-left:40px;margin-top:20px;margin-bottom:20px;border-radius:20px;backgroundk:purple;		
}
.icon_title
{
float:left;width:94%;height:30px;line-height:30px;margin-left:3%;font-weight:bold;text-align:center;	
}
.icon_desc
{
float:left;width:94%;height:30px;line-height:30px;margin-left:3%;margin-bottom:10px;text-align:center;color:#505252;
}


.card_home_div
{
float:left;width:100%;height:300px;margin-top:30px;background:orange;border-radius:20px;display:none;
box-shadow: rgba(0, 0, 0, 0.35) 0px -50px 36px -28px inset;	
}
.card_intro_lebal1
{
float:left;width:100%;height:60px;line-height:60px;margin-top:20px;margin-bottom:20px;text-align:center;font-size:2em;font-weight:bold;color:#fff;	
}
.card_intro_lebal
{
float:left;width:100%;height:40px;line-height:40px;text-align:center;font-size:1.3em;font-weight:bold;	
}
.card_intro_span
{
float:left;width:100%;height:60px;backgroundk:#ccc;display:flex;justify-content:center;align-items:center;	
}
.card_intro_icon
{
float:left;width:60px;height:60px;	
}
.card_start_btn
{
float:left;width:50%;height:47px;margin-left:25%;margin-top:10px;background:#1f94f6;color:#fff;border-radius:10px;cursor:pointer;border:0px;outline:none;font-weight:bold;	
}
.card_intro_member
{
float:left;width:75%;height:40px;line-height:50px;margin-left:20%;text-alignk:center;font-size:0.8em;font-weight:bold;color:purple;	
}

.download_app_div
{
float:left;width:98%;height:200px;margin-left:1%;margin-bottom:20px;margin-top:20px;background:#e06e14;border-radius:10px;
box-shadow: rgba(0, 0, 0, 0.25) 0px 14px 28px, rgba(0, 0, 0, 0.22) 0px 10px 10px;	
}
.download_app_lebal
{
float:left;width:100%;height:50px;line-height:50px;margin-bottom:30px;text-align:center;font-size:1.5em;color:#fff;font-weight:bold;	
}
.download_app_btn
{
float:left;width:60%;height:50px;margin-left:20%;border-radius:20px;border:0px;outline:none;font-size:1em;font-weight:bold;color:#000;cursor:pointer;	
}
.download_app_btn:hover{background:#ccc;color:#e06e14;}

.content_div
{
float:right;width:80%;min-height:70%;margin-right:1.5%;backgroundk:yellow;
}

.recommend_song_span
{
float:left;width:90%;height:40px;line-height:40px;margin-left:2%;color:#38f76f;font-weight:bold;font-size:1.1em;displayk:none;
}
.single_song_div
{
float:left;width:98%;height:75px;margin-left:1%;margin-bottom:15px;backgroundk:purple;border-radiusk:5px;border-bottom:1px solid #ecdc73;
}
.artist_img
{
float:left;width:60px;height:60px;margin-left:1%;border-radius:10px;margin-top:8px;
box-shadow: rgba(0, 0, 0, 0.16) 0px 1px 4px, rgb(51, 51, 51) 0px 0px 0px 3px;
}
.song_title
{
float:left;width:60%;height:25px;line-height:25px;margin-left:2%;margin-top:5px;font-weight:bold;font-size:1em;backgroundk:red;font-family:serif;
color:#505252;	
overflow: hidden;white-space: nowrap;text-overflow: ellipsis;margin-bottom:0px;	
}
.artist_name
{
float:left;width:60%;height:25px;line-height:25px;margin-left:2%;color:#000;font-size:0.8em;font-family:serif;font-weight:bold;
overflow: hidden;white-space: nowrap;text-overflow: ellipsis;backgroundk:green;margin-bottom:0px;	
}
.download_img_btn
{
float:right;width:50px;height:50px;margin-top:10px;margin-right:1%;		
}
.song_list_div
{
float:left;width:98%;margin-left:1%;background:#fff;border-radius:10px;
}
.top10_list_title
{
float:left;width:90%;height:40px;line-height:40px;margin-left:2%;color:#ededed;font-weight:bold;font-size:1.1em;displayk:none;
}
.top10_list_div
{
float:left;width:98%;margin-left:1%;margin-bottom:20px;background:#d6f8fb;border-radius:10px;
}

.new_music_list_div
{
float:left;width:98%;margin-left:1%;margin-bottom:20px;background:#000;border-radius:10px;
display:flex;justify-content:space-around;
}
.sub_new_music_div
{
float:left;width:45%;heightk:280px;backgroundk:yellow;	
}
.new_music_span
{
float:left;width:100%;height:300px;margin-top:10px;display:flex;justify-content:center;align-items:center;
}
.new_music_img
{
float:left;max-width:100%;max-height:100%;
}
.new_artist_name
{
float:left;width:98%;height:30px;line-height:30px;padding-left:2%;margin-top:-30px;color:#fff;font-family:0.8em;font-weight:bold;
overflow: hidden;white-space: nowrap;text-overflow: ellipsis;
background-color: rgba(007, 0, 0, 0.4);	
}
.new_music_name
{
float:left;width:96%;height:30px;line-height:30px;margin-left:2%;margin-topk:-30px;color:#ccc;font-family:0.8em;backgroundk:green;text-alignk:center;
overflow: hidden;white-space: nowrap;text-overflow: ellipsis;	
}

.dj_mixes_list_div
{
float:left;width:98%;margin-left:1%;margin-bottom:20px;background:#c8f521;border-radius:10px;
display:flex;justify-content:space-around;
}
.dj_name
{
float:left;width:98%;height:30px;line-height:30px;padding-left:2%;margin-top:-30px;color:#fff;font-family:0.8em;font-weight:bold;
overflow: hidden;white-space: nowrap;text-overflow: ellipsis;
background-color: rgba(007, 0, 0, 0.4);	
}
.song_mix_name
{
float:left;width:96%;height:30px;line-height:30px;margin-left:2%;margin-topk:-30px;color:#000;font-family:0.8em;backgroundk:green;text-alignk:center;
overflow: hidden;white-space: nowrap;text-overflow: ellipsis;	
}

.use_coblaa_title
{
float:left;width:90%;height:30px;line-height:30px;margin-left:2%;color:#c0f3b9;font-weight:bold;font-size:1.1em;displayk:none;
}
.use_coblaa_div
{
float:left;width:98%;margin-left:1%;margin-bottom:20px;background:#582dfa;border-radius:10px;
display:flex;justify-content:space-around;
}
.app_use_name
{
float:left;width:96%;height:30px;line-height:30px;margin-left:2%;margin-topk:-30px;color:#fff;font-family:0.8em;backgroundk:green;text-alignk:center;
overflow: hidden;white-space: nowrap;text-overflow: ellipsis;	
}

.load_more_btn
{
float:left;width:30%;height:40px;margin-left:35%;margin-top:30px;margin-bottom:20px;cursor:pointer;background:#22bb73;color:#fff;font-weight:bold;border-radius:10px;outline:none;
border:0px;	
}
.load_more_btn:hover{background:#ededed;color:#22bb73;}

.footer_div
{
float:left;width:100%;height:60px;line-height:60px;margin-top:20px;background:#ededed;text-align:center;display:none;	
}



@media screen and (max-width: 900px) 
{
.main_home_div
{
height:70px;
}
.main_header_div
{
margin-top:5px;
}
.main_search_div
{
float:left;width:94%;margin-left:3%;
}
.ser_input
{
width:75%;
}
.search_result
{
float:left;width:96%;margin-left:2%;
border-radius:10px;display:none;overflow:auto;
}
.menu_shell_div
{
width:100%;display:none;background-color: rgba(117, 0, 0, 0.4);	
}
.menu_div
{
width:60%;min-width:0%;height:100%;
}
.menu_clocing_div
{
float:right;width:38%;height:100%;display:block;
}
.menu_btn
{
width:70%;margin-left:15%;font-weight:bold;backgroundk:transparent;
}

.single_trend_div
{
float:left;width:23%;height:210px;margin-leftk:0.5%;
}
.trend_img_div
{
height:150px;width:100%;
}

.content_div
{
width:96%;margin-left:2%;
}


}
@media screen and (max-width: 800px) 
{
.single_trend_div
{
float:left;width:23%;height:210px;margin-leftk:1%;
}	
	
}
@media screen and (max-width: 700px) 
{
.single_trend_div
{
float:left;width:30%;height:210px;margin-leftk:1%;
}
.content_div
{
float:left;width:100%;margin-left:0%;backgroundk:green;
}
.category_div
{
width:98%;margin-left:1%;
}
.main_header_title
{
width:98%;height:50px;line-height:50px;margin-left:1%;font-size:1.3em;

}
.card_div
{
width:98%;margin-left:1%;
}	
	
}
@media screen and (max-width: 600px) 
{
.single_trend_div
{
float:left;width:40%;height:210px;margin-leftk:2.5%;
}	
	
}
@media screen and (max-width: 460px) 
{
.single_trend_div
{
float:left;width:46%;height:210px;margin-leftk:2.5%;
}	
	
}
@media screen and (max-width: 300px) 
{
.single_trend_div
{
float:left;width:95%;height:210px;margin-leftk:2.5%;
}	
	
}