body{margin:0px;backgroundk:linear-gradient(to right top, #fff, #FB6ED1);}

.main_container
{
width:100%;height:auto;background:linear-gradient(to right top, #fff, #FB6ED1);
display:flex;justify-content:center;
}
.sub_container
{
width:50%;min-height:100vh;height:auto;background:#FF0078;background:#4F3554;	
}
.main_head_div
{
float:left;width:100%;height:70px;margin-top:40px;margin-bottom:20px;backgroundk:orange;color:#fff;border-bottomk:1px solid #ededed;	
}
.cb_radio_log_div
{
float:left;width:60px;height:60px;background:#E4417C;margin:10px;border-radius:100%;	
}
.cb_radio_log_img
{
float:left;width:40px;height:40px;margin:10px;
}
.menu_icon_img
{
float:right;width:60px;height:60px;background:#fff;margin:10px;border-radius:5px;	
}
.main_title
{
float:left;width:50%;height:30px;line-height:30px;margin-top:25px;margin-left:20px;color:#fff;backgroundk:pink;font-size:1.3em;font-weight:bold;
}

.more_option_div
{
float:right;width:50%;height:300px;margin-top:-15px;background:#fff;border:1px solid #ccc;border-radius:10px 0px 0px 10px;	
}

.station_title
{
float:left;width:90%;height:50px;line-height:70px;margin-left:2%;margin-bottom:20px;text-alignk:center;font-size:1.5em;color:#E5B3C2;font-weight:200;
}
.main_section
{
width:100%;display:flex;flex-direction: column;justify-content:center;align-items:center;
}

.single_audio_div
{
float:left;width:96%;margin-top:20px;margin-bottom:20px;margin-left:2%;border-radius:20px;
background-image: linear-gradient(to right, #FF76C3 , #A0EFFF);	
}
#cur_audio{display:none;}
.audio_name
{
float:left;width:60%;height:30px;line-height:30px;margin-left:5%;margin-top:20px;color:#fff;font-size:1.4em;text-align:center;font-weight:bold;
backgroundk:red;	
}
.audio_lebal
{
float:left;width:60%;height:20px;line-height:20px;margin-left:5%;color:lightgreen;font-size:1em;text-align:center;font-weight:bold;display:none;
backgroundk:blue;	
}
.artist_name
{
float:left;width:60%;height:20px;line-height:20px;margin-left:5%;color:#000;font-size:1em;text-align:center;font-weight:bold;
backgroundk:green;	
}


.single_station
{
floatk:left;width:96%;margin-bottom:20px;background:#716E72;border-radius:20px;	
}
.radio_log_img
{
float:left;width:100px;height:100px;border-radius:20px;margin:10px;margin-left:20px;
box-shadow: rgba(6, 24, 44, 0.4) 0px 0px 0px 2px, rgba(6, 24, 44, 0.65) 0px 4px 6px -1px, rgba(255, 255, 255, 0.08) 0px 1px 0px inset;	
}
.play_btn
{
float:right;width:60px;height:60px;margin-top:29px;margin-right:10px;cursor:pointer;	
}
.station_name_h1
{
float:left;backgroundk:green;	
}
.station_name
{
float:left;width:100%;height:40px;line-height:50px;margin-top:20px;color:#fff;font-size:1.1em;text-align:center;font-weight:bold;
backgroundk:red;	
}
.station_freq
{
float:left;widthk:60%;heightk:40px;backgroundk:#fff;font-size:1em;text-align:center;color:#ccc;	
}

.footer
{
float:left;width:100%;height:70px;background:#ededed;
}
.footer_btn
{
margin-left:40%;margin-top:20px;font-size:1em;background:transparent;border:none;cursor:pointer;	
}
.footer_btn:hover{text-decoration:underline;}

@media screen and (max-width: 900px)
{
.main_head_div
{
float:left;width:100%;height:70px;margin-top:40px;color:#fff;	
}	
.sub_container
{
width:100%;min-height:100vh;height:auto;background:#FF0078;background:#4F3554;	
}

.single_audio_div
{
float:left;width:96%;margin-top:20px;margin-bottom:20px;margin-left:2%;border-radius:20px;
background-image: linear-gradient(to right, #FF76C3 , #A0EFFF);	
}
.audio_name
{
float:left;width:50%;height:30px;line-height:30px;margin-left:3%;margin-top:20px;color:#fff;font-size:1.4em;text-align:center;font-weight:bold;
backgroundk:red;	
}
.audio_lebal
{
float:left;width:50%;height:20px;line-height:20px;margin-left:5%;color:#11B703;font-size:0.9em;text-align:center;font-weight:bold;display:none;
backgroundk:blue;	
}
.artist_name
{
float:left;width:50%;height:20px;line-height:20px;margin-left:3%;color:#000;font-size:1em;text-align:center;font-weight:bold;
backgroundk:green;	
}
	
.radio_log_img
{
float:left;width:80px;height:80px;border-radius:20px;margin:10px;margin-left:10px;
box-shadow: rgba(6, 24, 44, 0.4) 0px 0px 0px 2px, rgba(6, 24, 44, 0.65) 0px 4px 6px -1px, rgba(255, 255, 255, 0.08) 0px 1px 0px inset;	
}
.play_btn
{
float:right;width:60px;height:60px;margin-top:22px;margin-right:10px;cursor:pointer;	
}
.station_name
{
float:left;width:100%;height:40px;line-height:50px;margin-top:0px;color:#fff;font-size:1em;text-align:center;font-weight:bold;backgroundk:#fff;	
}
.station_freq
{
float:left;widthk:50%;heightk:40px;backgroundk:#fff;font-size:0.9em;text-align:center;color:#ccc;	
}	
	
	
}	

@media screen and (max-width: 360px)
{
.radio_log_img
{
float:left;width:60px;height:60px;border-radius:20px;margin:10px;margin-left:10px;
box-shadow: rgba(6, 24, 44, 0.4) 0px 0px 0px 2px, rgba(6, 24, 44, 0.65) 0px 4px 6px -1px, rgba(255, 255, 255, 0.08) 0px 1px 0px inset;	
}
.play_btn
{
float:right;width:60px;height:60px;margin-top:10px;margin-right:10px;cursor:pointer;	
}
.station_name
{
float:left;width:50%;height:30px;line-height:40px;margin-top:10px;color:#fff;font-size:1.3em;text-align:center;font-weight:bold;backgroundk:#fff;	
}
.station_freq
{
float:left;width:50%;height:30px;backgroundk:#fff;font-size:1em;text-align:center;color:#ccc;	
}	
}