@import "font-awesome.css";
@import "https://fonts.googleapis.com/icon?family=Material+Icons";
@import "https://fonts.googleapis.com/css?family=Roboto:400";


a:link,	a:visited, a:hover,	a:active{ text-decoration: none; font-weight:400;}
a:link, a:visited {color:#707070;}
a:visited {}
a:hover, a:active {color:#e3e3e3;}
a:active{}

body {background:#111111; font-family: 'Roboto', sans-serif;}
.navbar { margin-bottom: 0; }
.bg-black {background:#232323;}
.bg-black2 {background:#1c1c1c;}
.bg-black3 {background:#4b4b4b;}
.btn-link{ color:#ff0000;}
.btn-link:hover{ color:#ff0000; opacity:.7}
.jumbotron { padding-top: 6rem; padding-bottom: 6rem; margin-bottom: 0; background-color: #000001; -webkit-border-radius: 0rem; -moz-border-radius: 0rem; border-radius: 0rem; }
.jumbotron p:last-child { margin-bottom: 0; }
.jumbotron-heading { font-size: 2.5rem; font-weight: 300; color:#707070; }
.jumbotron .container { max-width: 40rem; }
.radio-station { min-height: 50rem; padding-top: 3rem; padding-bottom: 3rem; background-color: #111111; }

footer { padding-top: 3rem; padding-bottom: 7rem; }
footer p { margin-bottom: .25rem; }
footer p span:before { content: "© ";}
footer p span:after { content: " Tamil Heart Beat. All Rights Reserved.";}

#logo { float:left; width:255px; height:40px; text-align:center; margin:5px 0; background:url(../img/logo.png) no-repeat; }
#logo:hover{ opacity:.7}

.hits-feature { margin-bottom: 20px; }
.hits-feature:hover { text-decoration:none; }
.row a .thumbnail { background-color: rgba(255,255,255,0.05); padding: .5rem; margin: 1rem 0; -webkit-border-radius: 1rem; -moz-border-radius: 1rem; border-radius: 1rem; }
.row a:hover .thumbnail { background-color: rgba(0,0,0,0.9); -webkit-box-shadow: #000000 0 0 10px; -moz-box-shadow: #000000 0 0 5px; box-shadow: #000000 0 0 10px; border-color:#000; }
.row a:hover .thumbnail .hits-text p {color:#FFF}
.hits-text p, #info h2 { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; -o-text-overflow: ellipsis; -icab-text-overflow: ellipsis; -khtml-text-overflow: ellipsis; -moz-text-overflow: ellipsis; -webkit-text-overflow: ellipsis; }
.hits-text p { padding-top:.7rem; font-size:.85em; }

.radioplayer {position: fixed; display: flex; bottom: 0px; width: 100%; height: 70px; z-index: 10000; background-color:#000000; padding: 5 16px; color:#ffffff;}
.radioplayer img { padding: 5px; width: 60px; height: 60px; }
.radioplayer .info { display: flex; flex-flow: column nowrap; justify-content: center; width: 50%; padding: 0 16px; }
.radioplayer .info .name { font-size: 15px; font-weight: 700; }
.radioplayer .info .singer { font-size: 12px; }
.radioplayer .btns { width: 50%; display: flex; justify-content: space-between; align-items: center; padding: 0 16px; }
.radioplayer .btns div:nth-child(1) { font-size: 30px; }
.radioplayer .btns div:nth-child(2),
.radioplayer .btns div:nth-child(3) { font-size: 18px; }
.radioplayer .progress { position: absolute; height: 2px; left: 0; top: 0; background-color: #00a8ff; }
@font-face { font-family: iconfont; src: url("../fonts/iconfont-4e6.woff") format("woff"); }
.iconfont { font-family: iconfont !important; font-size: 16px; font-style: normal; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }
.icon-list:before { content: "\e603"; }
.icon-loop-single:before { content: "\e604"; }
.icon-arrow-right:before { content: "\e605"; }
.icon-loop:before { content: "\e606"; }
.icon-prev:before { content: "\e607"; }
.icon-favor:before { content: "\e608"; }
.icon-next:before { content: "\e60a"; }
.icon-download:before { content: "\e60b"; }
.icon-search:before { content: "\e60c"; }
.icon-zhanwei1:before { content: "\e610"; }
.icon-favor1:before { content: "\e618"; }
.icon-random:before { content: "\e619"; }
.icon-play:before { content: "\e616"; }
.icon-stop:before { content: "\e617"; }
.icon-mv:before { content: "\e61b"; }
.icon-arrow-down:before { content: "\e61d"; }
.icon-arrow-left:before { content: "\e61e"; }
.icon-arrow-up:before { content: "\e61f"; }
.icon-listen:before { content: "\e609"; }
.icon-round:before { content: "\e60d"; }
.icon-triangle:before { content: "\e60e"; }
.icon-information:before { content: "\e60f"; }
.icon-home:before { content: "\e611"; }
.icon-i:before { content: "\e612"; }
.icon-information-:before { content: "\e613"; }
.icon-bubble-filled-icon:before { content: "\e614"; }
.icon-round-right:before { content: "\e615"; }
.icon-vip:before { content: "\e61a"; }
.icon-word:before { content: "\e61c"; }

#playlist{width:400px;padding:20px;}
.active a{color:#ff0000;text-decoration:none;}
li a{padding:5px;display:block;}
li a:hover{text-decoration:none;}