body { 
	font-family:Arial;
	background:#fff;
	color:#00305e;
	padding:20px;
	display: flex;
	flex-direction: column;
	justify-content: center;
	margin: 0;
	}

.box {
	background:#f9f9f9;
	padding:10px;
	margin:5px auto;
	border-radius:8px;
	display: flex;
	justify-content: center;
	align-items: center;
	width: fit-content;
	}

.box_header{
      text-align: center;
      font-weight: bold;
      padding: 20px 5px 0px 5px;           
      margin: 0px;
}
.box_header p {
    padding: 0px;
    margin: 0px;
}

    button { padding:8px 12px; margin:5px; }

input { padding:6px; }
a { color:#0f0; }
.header{
	width: 100%;
	text-align: center;
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 15px;
	color:#00305e;
	}
.container img {
  width: 50px;
  height: auto;
}	
@media (max-width: 1000px) {
    .stream-row {
        flex-direction: column;
        overflow-x: hidden;
        gap: 10px;
    }

    .stream-item {
        width: 70vw;
        justify-content: space-between;
        white-space: normal;
    }
}
.stream-row {
    display: flex;
    flex-wrap: nowrap;
    gap: 12px;
    overflow-x: auto;
    padding: 10px;
}

/* einzelne Items */
.stream-item {
    display: flex;
    align-items: center;
    gap: 10px;
    background: #fff;
    padding: 10px 12px;
    border-radius: 8px;
	border: solid 1px grey;
    white-space: nowrap;
    flex: 0 0 auto;
}

/* Button + Status */
.live {
    color: #00ff88;
    font-weight: bold;
}

.offline {
    color: #ff4444;
    font-weight: bold;
}

.btn {
    background: rgb(188, 188, 188);
    color: #00305e ;
    padding: 6px 12px;
    border-radius: 6px;
    text-decoration: none;
    font-weight: bold;
}

.stream-item .btn {
    color: #fff;
}

.btn:hover {
    /* background: #00cc66; */
    color:#fff;
}

/* ONLINE = grün */
.btn-on {
    background: #00c853;
}

.btn-on:hover {
    background: #00e676;
}

/* OFFLINE = rot */
.btn-off {
    background: #d50000;
}

.btn-off:hover {
    background: #ff1744;
}
.stream-text {
    display: flex;
    flex-direction: column;
}

.stream-text small {
    color: #aaa;
    font-size: 12px;
}