@charset "UTF-8";
/* CSS Document */
body {
	font-family: "Prompt";
}
.content_body {
	width: 1500px;
	max-width: 100%;
	position: relative;
	margin-left: auto;
	margin-right: auto;
}
img {
	max-width: 100%;
}
.row {
	margin-left: 0;
	margin-right: 0;
}
.logo {
	padding: 20px;
}
.otherstations {
	padding: 20px;
}
.social_button {
	display: block;
	position: absolute;
	right: 10%;
	top: 20px;
}
.social_button li {
	display: inline-block;
}
.sub-nav-bar {
	/*    width: 1260px;*/
	margin: 0 auto;
	position: relative;
	text-align: right;
	/*    padding: 8px 0 5px 0;*/
	/*    border-bottom: #000 1px solid;*/
}
.sub-nav-bar ul {
	padding: 0;
	margin: 0;
	position: relative;
	right: 40px;
	top: 80px;
}
.sub-nav-bar li {
	text-align: center;
	margin: 0;
	position: relative;
	display: inline-block;
	/*    border-right: 1px solid #fff;*/
}
.sub-nav-bar li a {
	font-size: 0.9em;
	letter-spacing: 2px;
	color: white;
	text-decoration: none;
	padding: 2px 15px;
	text-align: center;
	text-transform: uppercase;
	position: relative;
	color: #000;
}
.header-top-area {
	background: #114e88;
	color: #fff;
}
.header-top-area a {
	color: #fff;
}
.nav > li > a:hover {
	text-decoration: none;
	background-color: #1d5891;
}
.nav > li > a:visited {
	background-color: #1d5891;
}
.nowplaying {
	background-repeat: no-repeat;
	background-size: cover;
	background-position: 80%, 50%;
	width: 100%;
	height: 500px;
	position: relative;
	grid-area: nowplaying_song;
	display: grid;
	grid-template-columns: 248px 248px 248px 248px auto 75px;
	grid-template-rows: 250px 80px auto auto auto;
	grid-template-areas:
		"button_play div_cover div_song dj_photo dj_photo livechat"
		"button_play nextsong nextsong dj_photo dj_photo livechat"
		"button_play livecamera livecamera dj_photo dj_photo livechat"
		"billboard billboard billboard billboard  djname djname"
		"billboard billboard billboard billboard  djshift djshift";
	padding: 40px;
	color: #fff;
	z-index: 9;
}
.nowplaying-over {
	position: absolute;
	top: 0;
	left: 0;
	background-repeat: no-repeat;
	background-size: cover;
	background-position: 80%, 0;
	width: 100%;
	height: 1000px;
	z-index: 2;
	display: none;
}

.nowplaying_song > div {
	grid-area: myArea;
}
#button_play {
	grid-area: button_play;
	text-align: center;
	line-height: 50px;
	/*    font-size: 2vw;*/
	font-size: 36px;
	z-index: 9;
}
.djname {
	grid-area: djname;
}
#div_cover {
	grid-area: div_cover;
	z-index: 9;
}
#div_song {
	grid-area: div_song;
	padding-top: 30px;
	z-index: 9;
}
#nextsong {
	grid-area: nextsong; /*line-height: 0;*/
	z-index: 9; /*font-size: 1.2vw;*/
	font-size: 24px;
}
#songname {
	/*font-size: 2vw;*/
	font-size: 30px;
	z-index: 9;
}
#artist {
	/*font-size: 1.2vw;*/
	font-size: 24px;
	z-index: 9;
	margin-top: 20px;
}
#nextsongsub {
	/*font-size: 1vw;*/
	font-size: 16px;
	z-index: 9; /*position: absolute;bottom: 10px;*/
	margin-top: 15px;
}
#livecamera {
	grid-area: livecamera;
	z-index: 9;
	height: 70px; /*margin-top:-46px;*/
}
#livecamera_m {
	grid-area: livecamera_m;
	z-index: 9;
	display: none;
	margin-bottom: 10px;
	position: relative;
}
.nowplaying_bottom {
	grid-area: nowplaying_bottom;
	background: #fff;
	position: absolute;
	bottom: 80px;
	width: 100%;
}
.billboard {
	grid-area: billboard;
	position: absolute;
	left: 20px;
	padding: 10px;
	background: #fff;
	z-index: 3;
	box-shadow: 0px 0px 10px 0px #333;
	top: -50px;
}
.billboard_sub {
	grid-area: billboard;
	padding: 10px;
	background: #fff;
	z-index: 3;
	box-shadow: 0px 0px 10px 0px #333;
	margin-left: auto;
	margin-right: auto;
	min-width: auto;
	margin-top: 20px;
	margin-bottom: 20px;
}
.billboard_sub > div {
	min-width: 970px;
}
.billboard_m {
	grid-area: billboard_m;
	text-align: center;
	margin-top: 20px;
	padding: 10px;
	background: #fff;
	z-index: 3;
	box-shadow: 0px 0px 10px 0px #333;
	display: none;
}
.djinfo {
	position: absolute;
	top: -540px;
	right: 5%;
	width: auto;
	transform: translateX(-5%);
	z-index: 1;
}
.dj_photo {
	grid-area: dj_photo;
	height: 620px;
	width: 32vw;
	max-width: 487px;
	margin-top: -160px;
	margin-left: auto;
}
.djname {
	color: #16c1f3;
	font-weight: bold;
	padding: 20px 0 0 50px;
	margin-left: auto;
	margin-right: auto;
	z-index: 3;
}
#dj {
	/*font-size: 2vw;*/
	font-size: 28px;
	padding-right: 10px;
}
#djname {
	/*font-size: 4vw;*/
	font-size: 36px;
}
#djfullname {
	/*font-size: 2vw;     text-indent: 3vw; line-height: 2vw;*/
	font-size: 30px; /*text-indent: 34px;*/
	line-height: 30px;
}
.djshift {
	grid-area: djshift;
	color: #ed3b80;
	font-weight: normal;
	margin-top: 14px;
	border-left: 10px solid #ed3b80;
	padding-left: 10px;
	margin-left: auto;
	margin-right: auto;
	height: fit-content;
}
#djshift_m {
	color: #fff;
	font-weight: normal;
	margin-top: 14px;
	border-left: 10px solid #fff;
	padding-left: 10px;
	position: absolute;
	right: 10px;
	bottom: 35px;
	font-size: 2.5vw;
}
.djshift_sub {
	margin-top: 20px;
}
.livechat {
	grid-area: livechat;
	position: absolute;
	right: -40px;
	top: 50%;
	transform: translateY(-50%);
	z-index: 5;
}
.livechat > a > div {
	width: 75px;
	overflow-x: hidden;
}
.livechat > a > div:hover {
	width: 126px;
	overflow-x: hidden;
	transition: 1s;
}
.livechat > a > div:not(:hover) {
	width: 75px;
	overflow-x: hidden;
	transition: 1s;
}
.container-fluid {
	padding: 0;
}
#whats_up_banner {
	display: block;
	position: relative;
	z-index: 9;
	margin-top: 250px;
}
#whats_up_banner .carousel {
	width: 1000px;
	height: 650px;
	margin: 0 auto;
}

#whats_up_banner .carousel-control {
	color: #ed3b80 !important;
}

#whats_up_banner .carousel-control.left {
	margin-left: -200px;
	background: none !important;
}

#whats_up_banner .carousel-control.right {
	margin-right: -200px;
	background: none !important;
}
.carousel-indicators {
	bottom: -50px;
}

.carousel-indicators li {
	background-color: #ccc;
	border: 1px solid #ccc;
}
.carousel-indicators .active {
	background-color: #333;
}

#music_poll {
	margin-top: 50px;
	display: grid;
	grid-template-columns: auto 320px;
}
#music_poll_title {
	padding-left: 20px;
	overflow: hidden;
}
#music_poll_title > div:nth-child(1) {
	margin-bottom: 20px;
	display: grid;
	grid-template-columns: 200px auto;
	width: 99%;
}
#music_poll_main {
	color: #16c1f3;
	font-size: 30px;
	font-weight: bold;
}
#music_poll_tab {
	color: #fff;
	padding: 10px;
	font-size: 24px;
	background-color: #ed3b80;
	box-shadow: 5px 5px 0px 0px #aa1a52;
	width: 100%;
}
/*#music_poll_list{margin-left:5px;}*/
#music_poll_list > div {
	margin-bottom: 25px;
	margin-top: 25px;
}
#music_poll_list > div > a {
	text-decoration: none;
}
#music_poll_list > div > a > div > div:nth-child(2) {
	font-size: 22px;
	text-overflow: ellipsis;
	white-space: nowrap;
	overflow: hidden;
	width: 250px;
	max-width: 100%;
}
#music_poll_list > div > a > div > div > img {
	width: 142px;
}
#music_poll_more {
	padding: 10px;
	font-size: 24px;
	background: #ed3b80;
	width: 99%;
	text-align: center;
	color: #fff;
}
#music_poll_more > a {
	text-decoration: none;
	color: #fff;
}
#banner > div {
	padding: 0px 20px 10px 0px;
}
#footer {
	padding-left: 10px;
	display: grid;
	grid-template-columns: 195px 195px auto;
	max-width: 1500px;
	margin-left: auto;
	margin-right: auto;
}
#footer > div {
	padding: 10px;
}

.nowplaying_sub {
	color: #fff;
	background-color: #de6d38; /*min-height: 570px;*/
	background-repeat: no-repeat;
	background-position: top center;
	background-size: cover;
	display: grid;
	/*
	grid-template-columns: 15% 15% auto 3px 15% auto;
	grid-template-rows: auto auto auto auto;
*/
	grid-template-columns: 15% 142px auto 3px 180px auto;
	grid-template-rows: 142px 7px auto auto;
	grid-template-areas: "n_button n_cover n_song n_split n_djphoto n_djname" "n_button n_cover n_song n_split n_djphoto n_livecamera" "billboard billboard billboard billboard billboard billboard" "n_title n_title n_title n_title n_title n_title";
	padding: 20px 20px 0 20px;
}
.topic_title {
	padding: 5px 10px;
	font-size: large;
	border-radius: 5px;
	width: 210px;
	display: inline-block;
	right: 40%;
	/*    position: absolute;*/
}
.topic_title select {
	background: #b54612;
	border: none;
	width: 190px;
	padding: 5px;
	border-radius: 7px;
}
#livecamera_sub {
	grid-area: livecamera_sub;
	display: none;
}
.n_button {
	grid-area: n_button; /*padding: 10px;*/
	text-align: center;
}
.n_button > div {
	padding: 5px;
	font-size: 28px;
}
.n_cover {
	grid-area: n_cover;
}
.n_song {
	grid-area: n_song;
	padding: 20px 10px;
	position: relative;
}
.n_split {
	grid-area: n_split;
	padding-top: 10px;
}
.n_djphoto {
	grid-area: n_djphoto;
	padding: 0px 20px 0px 20px;
}
.n_livecamera {
	grid-area: n_livecamera;
}
.n_djname {
	grid-area: n_djname;
}
.n_title {
	grid-area: n_title;
	padding-left: 20px;
}
.billboard {
	grid-area: billboard;
	text-align: center;
}
.image-wrapper {
	width: 100%;
	aspect-ratio: 1 / 1;
	background-color: #fff;
	border-radius: 50%;
	margin: 0;
	padding: 0;
	background-size: cover;
}
#djprofile {
	display: grid;
	grid-template-columns: 50% 50%;
	padding-right: 20px;
}
/*	#djprofile>div:nth-child(5),#djprofile>div:nth-child(6){text-align: center; margin:20px 0 0 0;}*/
.dj_profile {
	display: grid;
	grid-template-columns: 250px auto;
	border: solid 1px #aaa;
	border-radius: 10px;
	margin: 20px 0 0 20px;
}
.dj_profile > div {
	padding: 10px;
}
.dj_profile > div:nth-child(1) > div {
	height: 270px;
	width: 100%;
}
.dj_profile > div:nth-child(2) {
	display: grid;
	grid-template-rows: auto auto auto 81px;
}
.dj_profile > div:nth-child(2) > div:nth-child(1) {
	color: #52cff3; /*font-size: 3vw;*/
	font-size: 36px;
}
.dj_profile > div:nth-child(2) > div:nth-child(2) {
	color: #52cff3; /*font-size: 1.2vw;*/
	font-size: 28px;
}
.dj_profile > div:nth-child(2) > div:nth-child(3) {
	color: #52cff3; /*font-size: 1.2vw;*/
	font-size: 22px;
}
.dj_profile > div:nth-child(2) > div:nth-child(4) {
	display: grid;
	grid-template-columns: auto auto;
	position: relative;
	width: fit-content;
}
.dj_profile > div:nth-child(2) > div:nth-child(4) > div {
	padding: 10px;
	color: #2267a9;
}
.dj_profile > div:nth-child(2) > div:nth-child(4) > div > img {
	position: absolute;
	left: 0;
	bottom: 0;
	height: 81px;
}
/*	.dj_profile>div:nth-child(2)>div:nth-child(4)>div:nth-child(2){padding-top:20px;}*/
#contactus > div > iframe {
	width: 100%;
}
#contactus > div {
	padding: 20px;
}
#contactus {
	display: grid;
	grid-template-columns: auto 380px;
	grid-template-rows: auto auto;
	grid-template-areas: "map map" "address banner";
}
#contactus > div:nth-child(1) {
	grid-area: map;
}
#contactus > div:nth-child(2) {
	grid-area: address;
	padding-lef: 40px;
}
#contactus > div:nth-child(2) > div {
	padding: 20px;
}
#contactus > div:nth-child(3) {
	grid-area: banner;
	padding-right: 40px;
}
#contactus > div:nth-child(3) > div {
	padding: 10px;
}
.contain_sub {
	display: grid;
	grid-template-columns: auto 380px;
	grid-template-areas: "detail banner";
}
.contain_sub > div:nth-child(1) {
	grid-area: detail;
}
.contain_border {
	background: #b54612;
	margin: 30px 0px 30px 40px;
	border-radius: 10px;
	/*    padding: 0px !important;*/
}
.contain_sub > div {
	padding: 20px 10px 20px 40px;
}
.contain_sub > div:nth-child(2) {
	grid-area: banner;
	padding-right: 40px;
}
.contain_sub > div:nth-child(2) > div {
	padding: 10px;
	text-decoration: none;
}
.contain_sub > div:nth-child(1) > div {
	padding: 20px;
}
.contain_sub > div:nth-child(1) > div > a {
	text-decoration: none;
}
.cover_music {
	width: 100px;
}
.song_name,
.song_name > a {
	color: #4d4d4d;
	font-size: 24px;
	font-weight: bold;
}
.song_artist,
.song_artist > a {
	color: #4d4d4d;
	font-size: 20px;
}

#signin-fb > a {
	display: block;
	padding: 1%;
	margin: 0 auto;
	font-size: 25px;
	font-weight: 300;
	line-height: 25px;
	text-align: center;
	white-space: nowrap;
	vertical-align: middle;
	cursor: pointer;
	border: 1px solid transparent;
	border-radius: 4px;
	color: #fff;
	text-decoration: none;
	background: #45619d;
	width: 50%;
}
#signin-fb > a:hover {
	background: #335295;
}
#signin-fb > a > img {
	width: 18px;
	margin-right: 2%;
}
#signin-fb > p {
	margin: 2% 0 0 0;
	text-align: center;
	font-size: 18px;
	line-height: 20px;
}
.fb_photo {
	border: solid 2px #de6d38;
	border-radius: 50%;
	width: 50px;
	height: 50px;
	display: inline-block;
	background-size: cover;
}
.fb_message {
	height: 100px;
	width: 400px;
	border-radius: 10px;
}
.fb_message textarea {
	width: 100%;
	height: inherit;
	border: solid 2px #de6d38;
	border-radius: 5px;
}
.fb_button {
	border: none;
	color: #fff;
	height: 100px;
	font-size: 2vw;
	background: #de6d38;
	padding: 20px;
	border-radius: 10px;
}
.fb_message_box {
	height: 500px;
	width: 90%;
	position: relative;
	padding-right: 5px !important;
	margin-left: auto;
	margin-right: auto;
}
.fb_message_box > div:nth-child(1) {
	border-radius: 10px;
	height: 480px;
	width: 100%;
	overflow-y: auto;
	z-index: 1;
}
#message_box {
	padding: 20px;
	margin-left: -30px;
	width: 100%;
}
.fb_message_box > div:nth-child(2) {
	position: absolute;
	top: 15px;
	left: 0;
	width: 95%;
	height: 500px;
	background: transparent;
	border-radius: 10px;
	border: solid 2px #de6d38;
	z-index: -1;
}
.fb_message_box > div:nth-child(1)::-webkit-scrollbar {
	width: 20px; /* Set the width of the scrollbar */
	background-image: url(/assets/images/scrollbar_bg.png); /* Set the background color of the scrollbar */
	position: absolute;
}
.fb_message_box > div:nth-child(1)::-webkit-scrollbar-thumb {
	background-color: #de6d38; /* Set the color of the thumb */
	border-radius: 5px;
}
.fb_message_box > div:nth-child(1)::-webkit-scrollbar-track {
	background: url(/assets/images/scrollbar_bg.png) #fff;
	background-position: top center;
	border: none;
	background-repeat: repeat-y;
}
#message_box li {
	padding: 2%;
	border-bottom: 1px solid #de6d38;
	list-style: none;
}
.dv_music {
	display: grid;
	grid-template-columns: 50% 50%;
}
.policy {
	/*    border-radius: 5px;*/
	box-shadow: 0px 0px 5px 1px #d0d0d0;
	display: none;
	position: fixed;
	left: 0px;
	right: 0px;
	height: auto;
	min-height: 21px;
	background: rgb(100, 88, 98, 1);
	color: rgb(255, 255, 255);
	line-height: 21px;
	padding: 8px 18px;
	font-family: verdana, arial, sans-serif;
	font-size: 14px;
	text-align: left;
	bottom: 0px;
	opacity: 1;
	width: 100%;
	z-index: 100;
}
.policy > div {
	display: grid;
	grid-template-columns: auto 150px;
	position: relative;
	width: 1500px;
	margin: auto;
	max-width: 100%;
}
.policy > div > div:nth-child(2) {
	margin: auto;
}
.policy > div:nth-child(2) {
	padding-top: 10px;
}
.acceptPolicy {
	border: none;
	display: block;
	padding: 5px 8px;
	min-width: 100px;
	margin-left: 5px;
	border-radius: 5px;
	cursor: pointer;
	color: rgb(255, 255, 2550);
	background: rgb(241, 0, 0);
	text-align: center;
	z-index: 101;
	margin: auto;
}
.dvPolicy {
	background: #fff;
	border: solid 1px #a6a6a5;
	position: initial;
	height: 200px;
	z-index: 200;
	padding: 10px;
	overflow-y: auto;
	overflow-x: hidden;
	font-size: 12px;
	font-family: auto;
}
/* Scrollbar */
.dvPolicy::-webkit-scrollbar {
	width: 10px;
}

/* Track */
.dvPolicy::-webkit-scrollbar-track {
	background: #dddddd;
	border: 4px solid transparent;
	background-clip: content-box; /* THIS IS IMPORTANT */
}

/* Handle */
.dvPolicy::-webkit-scrollbar-thumb {
	background: #b0b0b0;
	border: 1px solid rgb(176, 176, 176);
}
