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

.div_ad
{
float:left;width:96%;height:300px;margin-left:2%;margin-bottom:20px;display: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:right;width:98%;height:40px;line-height:40px;margin-leftk:3%;margin-bottom:0px;margin-top:30px;color:#000;font-size:1.3em;font-family: serif;font-weight:bold;
border-radius:10px 10px 0 0;
}
.category_div
{
float:right;width:100%;height:100px;margin-top:5px;background:#fff;display:flex;justify-content:space-between;align-items:center;border-radius:20px;
display:none;	
}
.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;	
}

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

.main_cb_video_player_div
{
float:left;width:100%;height:auto;margin-bottom:10px;background:#1d0303;	
}
.sub_cb_video_player_div
{
float:left;width:70%;height:500px;background:#000;display:flex;justify-content:center;align-items:center;	
}
.cb_video_player
{
float:left;width:100%;height:100%;displayk:none;	
}
.cb_video_lebal
{
float:left;width:63%;height:auto;line-height:30px;margin-left:1%;font-size:1.03em;color:#fff;font-weight:400;	
}
.view_icon_img
{
float:right;width:35px;height:35px;margin-top:15px;background:#fff;border-radius:50%;	
}
.view_out_lebal
{
float:right;height:40px;line-height:40px;margin-top:15px;margin-left:2px;margin-right:3px;color:#fff;	
}
.right_ad_div
{
float:right;width:28%;height:560px;background: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:2%;margin-bottomk:6px;font-size:1em;text-alignk: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:25px;margin-left:2%;font-size:0.9em;text-alignk: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:10px;
  display: flex;
  flex-wrap: wrap;
justify-content: space-around;
   
}
.single_trend_div
{
float:left;width:23%;height:260px;margin-bottom:15px;margin-top:15px;border-radius:10px;text-decoration:none;	
box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;
}
.single_trend_div:hover{border:1px solid #acfa79;background:#ededed;}
.single_trend_div:active{border:1px solid #fa6388;}
.trend_img_div
{
float:left;width:100%;height:200px;margin-leftk:1%;display:flex;justify-content:center;align-items:center;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:45px;height:45px;margin-top:-100px;margin-right:40%;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%;
}


.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;
}
.content_div
{
width:100%;margin-right:0%;
}
.single_trend_div
{
float:left;width:23%;height:210px;margin-leftk:0.5%;
}
.trend_img_div
{
height:150px;width:100%;
}


.sub_cb_video_player_div
{
width:100%;height:480px;background:pink;display:flex;justify-content:center;align-items:center;	
}
.right_ad_div{display:none;}
.cb_video_lebal
{
width:75%;	
}
.positioning_div{margin-bottom:0px;}

}
@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%;
}
.sub_cb_video_player_div
{
width:100%;height:360px;background:green;display:flex;justify-content:center;align-items:center;	
}	
	
}
@media screen and (max-width: 600px) 
{
.main_header_title
{
float:right;width:95%;height:40px;line-height:40px;margin-leftk:3%;margin-bottom:0px;margin-top:30px;color:#000;font-size:1.3em;font-family: serif;font-weight:bold;
border-radius:10px 10px 0 0;	
}
.single_trend_div
{
/*float:left;width:40%;height:210px;margin-leftk:2.5%;*/
float:left;width:90%;height:290px;
}	
.trend_img_div
{
float:left;width:100%;height:230px;	
}
	
}

@media screen and (max-width: 300px) 
{
.single_trend_div
{
float:left;width:95%;height:210px;margin-leftk:2.5%;
}	
	
}