html {
     background: rgba(0, 0, 0, 0.9);
}

body {
     font-family: 'Roboto', sans-serif;
     margin: 0;
     padding: 0;
     width: 100%;
}

a {
     text-decoration: none;
}

.hide {
     display: none;
}

#playcontrols {
     text-align: center;
     margin-top: 20px;
}

#playcontrols #activityindicator,
#playcontrols #stopbutton {
     display: none;
}

.air-player {
     overflow: hidden;
     width: 100%;
     min-height: 100vh;
}

.body-background {
     background: url('../images/bg.webp');
     background-size: cover;
     min-height: 100vh;
}

#playcontrols {
     text-align: center;
     margin-top: 20px;
}

.circle {
     height: 100px;
     width: 100px;
     border-radius: 50%;
     background-color: #006999;
     display: flex;
     align-items: center;
     justify-content: center;
     cursor: pointer;
     position: relative;
     margin: 0 auto;
     margin-bottom: 10px;
}

.circle:before,
.circle:after {
     content: '';
     position: absolute;
     top: 0;
     right: 0;
     bottom: 0;
     left: 0;
     border: 2px solid #006999;
     border-radius: 50%;
     pointer-events: none;
}

.circle:before {
     animation: ripple 2s linear infinite;
}

.circle:after {
     animation: ripple 2s linear 1s infinite;
}

@keyframes ripple {
     0% {
          transform: scale(1);
          opacity: 1;
     }

     50% {
          transform: scale(1.3);
          opacity: 1;
     }

     100% {
          transform: scale(1.6);
          opacity: 0;
     }
}

#textpositiondiv {
     color: #006999;
     font-weight: bold;
     font-size: 16px;
     margin-top: 25px;
}

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

     .air-player,
     .body-background {
          width: 100%;
          min-height: 100vh;
     }

     .circle {
          height: 100px;
          width: 100px;
     }

     .circle img {
          width: 65px !important;
          height: 65px !important;
     }
}

@media only screen and (min-width: 992px) {
     .air-player {
          width: 400px;
          height: 600px;
     }

     .body-background {
          min-height: 600px;
     }
}

@media only screen and (min-width: 1200px) {
     .air-player {
          width: 400px;
          height: 600px;
     }

     .body-background {
          min-height: 600px;
     }
}
 #stream-title {
font-size: 14px;
font-weight: 600;
color: #ff0000;
margin-top:5px;
}