@media only screen and (max-width : 767px) {
    .header-txt {  position: static;  margin-top: 35px; }
    #home-player { margin-top: 20px; }
    #top{ margin-top: 20px; }


}

@media only screen and (min-width : 767px) and (max-width : 992px) {
    .header-txt{ bottom: 20px; }    
    #home-player { margin-top: 30px; }
    #top{ margin-top: 30px; }
}

@media only screen and (min-width : 992px) and (max-width : 1200px) {

    .header-txt{ bottom: 20px; }
}


@media only screen and (max-width : 620px) {
    .jp-interface { width: 100%; }
    .jp-gui { width: 100%; }
    .jp-progress { width: 150px; }
    .jp-volume-bar { width: 100px; }
    
    
}



@media only screen and (min-width : 320px) and (max-width : 480px) {
    .jp-interface { width: 100%; }
    .jp-gui { width: 100%; }
    .jp-volume-bar { width: 105px; }
    .header-address{ width: 100%; }
}


@media (max-width: 480px) {
  .hidden-xsl {
    display: none !important;
  }
}

.visible-xsl {
  display: none !important;
}
@media (max-width: 480px) {
  .visible-xsl {
    display: block !important;
  }
}