@media screen and (max-width: 1280px) {
.main-nav.navbar-default .navbar-nav > li > a{ padding:24px 10px}
#right-tabs .navi-tabs li a{ padding:22px 15px 19px}

}

@media screen and (max-width: 990px) {
#search{ padding-top:25px;}
#search{ clear:both;}
.panel-styled{ margin-left:-15px; margin-right:-15px; border:0px;}
.left-content{ border:0px;}
.panel.learnBlog{ margin-right:0px;}
#right-tabs{ margin-left:15px; margin-right:15px;}
.right-content { margin-left:0px;}
}



@media screen and (max-width: 768px) {

#apps span{ display:none;}
#search{ padding-top:10px; background:#03A9F4;}
#apps{ margin-top:10px; margin-bottom:0px;}
.header{ padding-bottom:0px;}
.header .nav-icon{ padding:0px;}
.header .nav-icon img{ height:30px; width:auto;}
.header{ padding-top:10px; padding-bottom:10px;}
#user-info{ margin-top:10px;}
#user-info .login{ padding:3px 10px 5px 10px;}
#user-info{ margin-top:-35px;}
#user-info img{ width:60px;}
.main-nav.navbar-default .navbar-brand{ margin-top:0px;}
.banner> .carousel-inner .item{ height: auto; padding:15px; padding-bottom:100px; }
/*.banner> .carousel-inner h3{ font-weight:300; font-size:20px; margin-top:25px;}
.banner> .carousel-inner p{ font-size:12px; margin-bottom:3px;}*/
.banner > .carousel-inner .banner-img img{ margin:0px;}
.album-list li{ width:24.5%}

.panel.learnBlog{ margin-right:0px; text-align:center;}
.panel.learnBlog img{ width:100%; height:auto}
.panel.learnBlog .text-right{ text-align:center;}
.panel.learnBlog hr{ margin:10px -15px;}
.main-nav.navbar-default .navbar-nav > li > a {  padding:10px 10px; border-bottom: solid 1px #ccc;}
#search{ border:0; margin-top:-1px; padding-bottom:10px;}

.playlist-row{ padding-top:5px; border-top: solid 2px #F43D2B}
.playlist-panel .playlist-col{ padding:5px;}
.playlist-col h5{ margin:0px; padding-left:10px;}
.playlist-col h5 small{ display:inherit; font-size:14px; margin-bottom:10px;}
.playlist-header{ display:none;}
.playlist-options{ background: #333; text-align:center; margin-top:15px;}

.banner .banner-content {
  margin-left: 0px;
}
#search > .input-group{ margin-left:0px;}
#search > .input-group .form-control{ border:0; border-left: solid 1px #999}
#search > .input-group .input-group-btn .btn{ border:0px !important; height:34px;}
#search > .input-group .input-group-btn .btn i{ margin-top:-5px;}

.playscroll{ width:100%;}
.audio-player{ padding:0px; line-height:0px;}
.audio-player{ padding-bottom:0px !important;}
.audio-player h5{ padding-top:5px; padding-bottom:5px;}

}

@media screen and (max-width: 480px) {
.container{ margin:0 10px;}
#main-logo{ margin-left:-15px;}
#user-info{  padding-right:0px;}
.container.header{ margin:;}
.header .nav-icon img{ height:25px; width:auto;}
.banner > .carousel-inner .banner-img{float:none; width:100%; margin:0px; padding:0px; }
.banner > .carousel-inner .banner-img img{ max-width:inherit;  width:100%;}
.banner > .carousel-inner .banner-content{ text-align:center; width:100%; float:none;}
.carousel-control .glyphicon-chevron-right, .carousel-control .icon-next, .carousel-control .glyphicon-chevron-left, .carousel-control .icon-prev{ margin-top:80px; background:rgba(0, 0, 0, 0)}

.carousel-control.right, .carousel-control.left{ background:rgba(0, 0, 0, 0)}
.album-list li{ width:141px; margin:5px 2px;}

.album-list li{ width:48%;}

.referFriend{ display:none;}



}