body { 
    font-family:"arial";
    background-color:#000;   
    color:#aaa;
    padding:20px;
    position:relative;
    max-width: 100%;
    overflow-x: hidden;
}
html {
    -webkit-text-size-adjust: 100%; /* Prevent font scaling in landscape while allowing user zoom */
}
select {
-webkit-appearance: none;
}
:root {
  --nblue: #39c;
  --nwhite: #aaa;
}

a { 
   color:#39c;
   text-decoration:none;
}
a:hover {
   text-decoration:underline;
}
hr {
border: 0; border-top: 1px solid #888;
}


.stripetable tr:nth-child(odd){
  background-color: #111;
}

.nomargin-table{
   border-collapse: collapse;
   font-size:110%;
}
.nomargin-table tr {
   padding-bottom:10px;
}
.nomargin-table td {
   padding: 0; 
   margin: 0;
   padding-right:5px;
   padding-bottom:3px;
}
.nb_user_edit_div {
   padding:3px;
   background-color: #888;
   color: #000;
}
.tag_red {
   color:#39c;
   font-size:80%;
   font-weight:bold;
   background-color:#000;
   padding:2px;
   border-radius:2px;
}
.ninlink {
   cursor:pointer;
}
.ninlink:hover {
    color:#aaa;
}

.ninbut {
   border-radius:2px;
   background-color:#555;
   border:none;
   margin-bottom:3px;
   noutline:none;
   nheight:24px;
   height:32px;
   cursor:pointer;
   color:#ddd;
}
.menu-button {
   float:right;
   color:#888;
   height:52px;
   width:42px;
}
.nb-menu-float {
   position:absolute;
   border-radius:3px;
   ntop:55px;
   nright:15px;
   padding: 8px;
   cursor:pointer;
   background-color:#666;
   z-index:100;
	
}
.nb-menu {
   position:absolute;
   border-radius:3px;
   top:55px;
   right:15px;
   padding: 8px;
   cursor:pointer;
   background-color:#444;
   z-index:100;
	
}
.menu_item {
    margin-right:10px;
    font-size:110%;
    nfont-weight:bold;
    cursor:pointer;
    color:#888;
}
.menu_item:hover {
    color:#39c;
}
.nb-menu-item {
    min-width:100px;
    font-size:120%;
    padding:10px;
    border-radius:5px;
}
.nb-menu-item:hover {
    background-color:#222;
    
    color:#39c;
}
.nb-menu-item-selected
{
    color:#39c;
}
.nb-profile-edit-textarea {
   font-family:'arial';
   width:230px;
   border-radius:3px;
   background-color:#555;
   border:none;
   padding:3px;
   margin-bottom:3px;
   outline:none;
   min-height:30px;
   font-size:110%;
   cursor:pointer;
   color:#ddd;
   padding:5px;
   text-align:left;
   min-height:36px;
   line-height:26px;
height: fit-content;
   noverflow: hidden;
   white-space: normal;
}
.nb-profile-edit-button {
    border-style:solid;
    border-width:1px;
    border-color:#000;
}
.nb-profile-edit-button:hover {
    border-style:solid;
    border-width:1px;
    border-color:#39c;
    bbackground-color:#39c;
}
.nb-profile-edit {
   border-radius:3px;
   background-color:#555;
    border-color:#39c;
   border:none;
   padding:3px;
   margin-bottom:3px;
   outline:none;
   min-height:30px;
   font-size:110%;
   cursor:pointer;
   background-color:#444;
   color:#ddd;
}
.profile_field {
    border-width:1px;
    border-style:solid;
    border-color:#000;
   width:240px;
   padding:5px;
   text-align:left;
   min-height:36px;
   line-height:26px;
height: fit-content;
   overflow: hidden;
   white-space: normal;
}
.ninsel-lg {
   border-radius:3px;
   background-color:#555;
   border:none;
   margin-bottom:3px;
   outline:none;
   height:30px;
   font-size:110%;
   cursor:pointer;
   color:#ddd;
}
.ninbut-lg {
   border-radius:3px;
   background-color:#555;
   border:none;
   margin-bottom:3px;
   outline:none;
   height:30px;
   font-size:110%;
   cursor:pointer;
   color:#ddd;
}
.ninbut-xlg {
   border-radius:3px;
   background-color:#555;
   border:none;
   margin-bottom:3px;
   outline:none;
   height:36px;
   font-size:100%;
   cursor:pointer;
   color:#ddd;
}
.ninbut-lg:hover {
    color:#39c;
}
.ninbut:hover {
    color:#39c;
}
.ninput {
   border-radius:3px;
   outline:none;
   background-color:#555;
   border:none;
   height:24px;
   width:202px;
   color:#ddd;
   margin-bottom:5px;
   width: 250px;
    padding: 5px;
    -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
    -moz-box-sizing: border-box;    /* Firefox, other Gecko */
    box-sizing: border-box;         /* Opera/IE 8+ */
   
}
.ninput-lg {
   border-radius:3px;
   outline:none;
   background-color:#444;
   border:none;
   height:30px;
   width:100%;
   color:#ddd;
   font-size:120%;
   margin-bottom:5px;
   
}
.ninseeker {
   border:none;
    cursor:pointer;
    nwidth:200px;
    height:18px;
    height:22px;
    border-radius:5px;
    margin-bottom:-5px;
    background-color:#aaa;
    background-color:#555;
    width: 40%;
    width: -webkit-calc(100% - 245px);
    width: -moz-calc(100% - 245px);
    width: calc(100% - 245px);
    min-width:75px;
}
.moretracks {
    border-radius:3px;
    border-style:none;
    nwidth:520px; 
    width:100%; 
    height:55px;
    background-color:#333;
    border-color:#888;
    color:#39c;
}
.moretracks:hover {
    background-color:#666;
}
.flag {
    border-radius:3px;
    max-height:32px; 
    width:48px; 
}
.current_song {
    color:#39c;
    cursor:pointer;
}
.player_song {
    Nfont-weight:bold;
    nfont-size:110%;
    color:#aaa;
}
.player_song:hover {
    color:#39c;
    cursor:pointer;
}
.mp3list:hover {
    color:#39c;
}
.mp3list {
    cursor:pointer;
    overflow-wrap: break-word;
    nmargin-bottom:3px;
}
.privatemsg:hover {
    color:#39c;
    background-color:#555;
}
.privatemsg {
    padding:0px;
    padding:5px;
    border-radius:3px;
    overflow-wrap: break-word;
    cursor:pointer;
}
.videolist:hover {
    color:#39c;
}
.videolist {
    padding:0px;
    overflow-wrap: break-word;
}
.server_list_server {
    font-size:110%;
    margin-bottom:5px;
    overflow-wrap: break-word;
    line-break: anywhere;
}
.wrap { 
   white-space: pre-wrap;      /* CSS3 */   
   white-space: -moz-pre-wrap; /* Firefox */    
   white-space: -pre-wrap;     /* Opera <7 */   
   white-space: -o-pre-wrap;   /* Opera 7 */    
   word-wrap: break-word;      /* IE */
}
.server_list {
    padding:0px;
    width: 20%;
    nomax-width: 240px;
    nomax-width: 100%;
    max-width: 300px;
    max-width: 240px;
    min-width: 240px;
    nomin-width: 200px;
    margin-right:25px;
    noverflow:hidden;
    noverflow-y:scroll;

    float:left;
}
.server_list_mobile {
    nomax-width: 400px;
    width: 100%;
}

.server_list {
}
.wrap { 
   white-space: pre-wrap;      /* CSS3 */   
   white-space: -moz-pre-wrap; /* Firefox */    
   white-space: -pre-wrap;     /* Opera <7 */   
   white-space: -o-pre-wrap;   /* Opera 7 */    
   word-wrap: break-word;      /* IE */
}
.server_name {

    font-size:100%;
    color:#39c;
    cursor:pointer;
}

.content_header {

    font-size:110%;
    color:#36b;
    color:#aaa;
    color:#888;
    nfont-weight:bold;
}
.content {
   float:left;
   width: calc(75% - 100px);
   width: calc(100% - 280px);
   nmin-width:200px;
}
::-webkit-scrollbar {
    width: 20px;
}

::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 6px rgba(64,64,64,0.9);
    border-radius: 10px;
}

::-webkit-scrollbar-thumb {
    border-radius: 10px;
    background-color:#aaa;
    -webkit-box-shadow: inset 0 0 6px rgba(80,80,80,0.9);
}

.nb-callout {
   background-color:#222;
   border-radius:5px;
   padding:10px;
}

.player_share_menu {
    position:absolute;
    background-color:#444;
    npadding-top:10px;
    npadding-bottom:10px;
    padding:0px;
    border-radius:3px;
    cursor:pointer;

    right:0;
    bottom:50px;
}
.player_share_menu_item {
    padding:10px;
    font-size:110%;

}
.player_share_menu_item:hover {
    background-color:#222;
    color:#3ac;
}

#audio_panel {
   position:fixed;
   bottom:0;
   nwidth:100%;
   background-color:#222;
   padding:13px;
   border-radius:3px;;
   right:32px;
   min-width:320px;
   nmax-width:calc(100% -200px);
   max-width:calc(620px);
   z-index:1000;
}
#notaudio_panel {
noposition:absolute;
position:fixed;
noposition:absolute;
background-color:#222;
border-radius:3px;;float:right;min-width:225px;max-width:calc(100% -20px);position:absolute;
right:0px;
padding:15px;
padding-bottom:25px;
notop:0;
bottom:0;
z-index:1000;
}
#video_panel {
noposition:absolute;
position:fixed;

background-color:#222;
border-radius:3px;;float:right;max-width:90%;height:270px;;
noposition:absolute;
right:0px;
padding:15px;
padding-bottom:25px;
top:0px;
}

.nb-menu {
   position:absolute;
   border-radius:3px;
   top:70px;
   right:25px;
   padding: 8px;
   cursor:pointer;
   background-color:#444;
   z-index:1010;
	
}
@media all and (max-width : 900px) {
    body {
       nmargin-left: -5%;
       padding:0px;
    }
    .nb-menu {
   	top:50px;
   	right:5px;
    }
}
@media all and (max-width : 600px) {
    .nb-menu {
        top:50px;
        right:5px;
    }

    body {
       nmargin-left: -5%;
       padding:0;
    }
    .server_list {
 	width:100%;
    }
    .content {
 	width:100%;
    }
}


.search_bar {
   width: calc(100% - 0px);
   max-width:240px;
   nwidth: calc(100% - 0px);
}
.nb-login-center {
   margin-left:-5px;
}

@media screen and (max-width: 600px) {
.nocontent {
   width: 100%;
}
.nb-login-center {
   margin-left:0px;
}
     .search_bar {
   	width: 100%;
     }
    .nb-menu-bar {
        display: none !important;
    }
}

.nb-news-headline {
   font-weight:bold;
   font-size:140%;
   margin-top:15px;
}
.nb-news-div {
    color:#39c;
    color:#aaa;
    font-size:120%;
    margin-bottom:10px;
    margin-top:20px;
    font-weight:bold;
}
.nb-news-date {
   font-size:85%;
}
.nb-news-body {
   margin-top:5px;
   max-width:600px;
}
.nb-video-stream {
   color:#39c;
}
.nb-login-picture-div:hover {
   border-color:#39c;
   border-style:solid;
}
.nb-login-picture-square {
  width: 320px;
}
.nb-login-picture-cool {
  display: block;
  max-width:230px;
  max-height:95px;
  width: auto;
  height: auto;
}
.nb-avatar-div {
   border-color:#000;
   border-style:solid;
  display: inline-block;
  position: relative;
  width: 32px;
  height: 24px;
   border-radius:3px;
  overflow: hidden;
}
.nb-user-name {
   cursor:pointer;
}
.nb-user-name:hover {
    color:#39c;
}
.nb-avatar-div {
    display: flex;
    justify-content: center;
    align-items: center;
    overflow: hidden
}
.nb-avatar-div img {
    flex-shrink: 0;
    min-width: 100%;
    min-height: 100%
}
.nb-login-picture-div {
   border-color:#000;
   border-style:solid;
  display: inline-block;
  position: relative;
  width: 40px;
  height: 40px;
   border-radius:50%;
  overflow: hidden;
  float:right;
}
.nb-login-picture {
    width:auto;
    height:100%;
    margin-left:0;
    object-fit:scale-down;
}
.nb-login-name {
   float:right;
   nfont-size:120%;
   margin-right:10px;
   margin-top:13px;
   color:#999;
   font-weight:bold;
   
}
.nb-login-input {
   nfont-size:120%;
}
.nb-login {
   width:90%;
   nheight:300px;
   padding:10px;
   background-color:#000;
}
.signup_noerror {
    color:#0e0;
    margin-left:10px;
}
.signup_error {
    color:#e00;
    nfont-weight:bold;
    margin-left:10px;
}

.profile_desc {
   font-size:80%;
   padding:5px;
   line-height:26px;
}

.nvideo-container {
      position: relative;
      overflow: hidden;
      height: 0;
      padding-bottom: 56.25%; /* calculate by aspect ratio (h / w * 100%) */
}
.nvideo-container .nvideo {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
}
.nb_user_search_item {
   border-style:solid;
   background-color:#222;
   cursor:pointer;
}
.nb_user_search_item:hover {
    border-style:solid;
    border-width:1px;
    border-color:#39c;
    color:#39c;
}
.nb_user_search_item {

}