<script>
      var AFinal;
      var TSFinal;

      $(function(){


      var players;
      var maxPlayers;
      var Astatus;

      $.getJSON("https://arma3-servers.net/api/?object=servers&element=detail&key=kBzgRwMzvun9ueSCFR4TrQS9LO2R6lrVKn0", function(response) {
      players = response.players;
      maxPlayers = response.maxplayers;
      Astatus = response.is_online;

      if (Astatus == "1"){
      AFinal = "1";
      $(".serverBarMainCount").html(players + '/' + maxPlayers);
      $(".serverBarMainCount").css({"color" : "#53DD6C"});
      } else {
      AFinal = "0";
      $(".serverBarMainCount").html("OFFLINE");
      $(".serverBarMainCount").css({"color" : "#A52C2C"});
      }});

      $.getJSON("https://teamspeak-servers.org/api/?object=servers&element=detail&key=AiH5Hz77eaccnmNv9PQ89Uo1TXovuF2ZeD", function(response) {
      var ts_players = response.players;
      var ts_max = response.maxplayers;
      var ts_status = response.is_online;

      if (ts_status == "1"){;
      TSFinal = "1";
      $(".serverBarTSCount").html(ts_players + '/' + ts_max);
      $(".serverBarTSCount").css({"color" : "#53DD6C"});
      } else {
      TSFinal = "0";
      $(".serverBarTSCount").html("OFFLINE");
      $(".serverBarTSCount").css({"color" : "#A52C2C"});
      }

      if (AFinal == "1" && TSFinal == "1"){
      $(".serverStatuses").html("SERVEREN OG TEAMSPEAK ER OPPE");
      } else {
      if (AFinal == "0" && TSFinal == "1"){
      $(".serverStatuses").html("SERVEREN ER NEDE, TEAMSPEAK ER OPPE");
      } else {
      if (AFinal == "1" && TSFinal == "0"){
      $(".serverStatuses").html("SERVEREN ER OPPE, TEAMSPEAK ER NEDE");
      } else {
      if (AFinal == "0" && TSFinal == "0"){
      $(".serverStatuses").html("SERVEREN OG TEAMSPEAK ER NEDE");
      }
    }
  }
}});});
</script>
<div class="serverBarBox">
      <a href="">
         </a><div class="serverBarJoin"><a href="">
           </a><a href="steam://connect/164.132.204.230:2302">
            <span class="serverBarJoinSpan">SPIL ROLEPLAY-STUDIOS!</span>
         </a>
</div>

      <div class="serverBar">
         <div class="serverBarMain">
            <a href="steam://connect/164.132.204.230:2302">
            <span class="serverBarMainSpan" data-ipstooltip="" _title="Join Server">EQUAL ISLANDS</span>
            </a>
            <br><span class="serverBarMainCount" style="color: rgb(83, 221, 108);">0/110</span>
         </div>
         <div class="serverBarTS">
            <a href="ts3server://ts.roleplay-studios.dk:9987">
            <span class="serverBarTSSpan" data-ipstooltip="" _title="Join Teamspeak">TEAMSPEAK</span>
            </a>
            <br><span class="serverBarTSCount" style="color: rgb(83, 221, 108);">3/100</span>
         </div>
        <div class="serverBarFM">
            <a href="ts3server://ts.roleplay-studios.dk:9987">
            <span class="serverBarTSSpan" data-ipstooltip="" _title="Join Teamspeak">TEAMSPEAK</span>
            </a>
            <br><span class="serverBarTSCount" style="color: rgb(83, 221, 108);">3/100</span>
         <div class="serverStatusesBox">
            <span class="serverStatuses">SERVEREN OG TEAMSPEAK ER OPPE</span>
         </div>
      </div>
   </div>









.serverBarBox {
 position:relative;
 width:1398px;
 height:60px;
 transform:translateX(-50%);
 left:50%;
 top:-20px;
 margin-top:50px;
}
.serverBarJoin {
 position:relative;
 float:left;
 height:100%;
 width:300px;
 background:rgba(21, 21, 21, 0.84);
 text-align:center;
 cursor:pointer;
}
.serverBarJoinSpan {
 position:relative;
 color:white;
 font-size:18px;
 right:4px;
 top:21px;
}
.serverBarJoin:hover i.fas.fa-angle-right {
 left:24px;
 color:white;
}
.serverBar {
 position:relative;
 float:right;
 height:100%;
 width:1080px;
 background:rgba(21, 21, 21, 0.84);
 display:flex;
}
.serverBarMain,
.serverBarTS {
 position:relative;
 height:100%;
 width:130px;
 position:relative;
 text-align:center;
 margin-left:18px;
 border-right:1px solid #ffffff21;
 ;
}
.serverBarTS {
 top:3px;
 position:relative;
}
.serverBarMain,
.serverBarFM {
 position:relative;
 height:100%;
 width:130px;
 position:relative;
 text-align:center;
 margin-left:18px;
 border-right:1px solid #ffffff21;
 ;
}
.serverStatusesBox {
 width:760px;
 height:100%;
 position:relative;
 float:right;
 right:15px;
 text-align:center;
}
.serverBarMainSpan,
.serverBarTSSpan {
 position:relative;
 color:white;
 font-size:14px;
 font-weight:bold;
 top:8px;
}
.serverBarMainSpan {
 top:10px;
 left: -5px;
}
.serverBarMainCount,
.serverBarTSCount,
.serverBarMainCount2 {
 position:relative;
 top:10px;
 font-weight:bold;
 left:-3px;
}
.serverBarMainCount,
.serverBarMainCount2 {
 top:13px;
}
.serverStatuses {
 position:relative;
 font-size:14px;
 font-weight:bold;
 top:21px;
 color:#fff;
}
@media screen and (max-width:1450px) {
 .serverBarJoin {
  display:none;
 }
 .serverBar {
  position:relative;
  float:none;
  height:100%;
  width:98.6vw;
  background:rgba(21, 21, 21, 0.84);
  transform:translateX(-50%);
  left:50%;
 }
}