@font-face {
	font-family: JetBrainsMono;
	src: url(/fonts/fonts/webfonts/JetBrainsMono-Regular.woff2);
}

body {
	font-family: 'JetBrainsMono', monospace ;
	letter-spacing: -1px ;
	text-shadow: 2px 2px 0 #000 ;
	background: #131619 ;
	color: #ccc ;
}

main {
	background: #131619 ;
	max-width: 800px ;
	margin: auto ;
}

img {
	max-width: 100% ;
}

header h1 {
	text-align: center ;
}

footer {
	text-align: center ;
	clear: both ;
}

/* For TAGLIST.HTML */
.taglist {
	text-align: center ;
	clear: both ;
}

/* For NEXTPREV.HTML */
#nextprev {
	/* The container for both the previous and next articles. */
}
#prevart {
	float: left ;
	text-align: left ;
}
#nextart {
	float: right ;
	text-align: right ;
}
#nextart,#prevart {
	max-width: 33% ;
}

.live-dot {
    width: 8px; /* Adjust size as needed */
    height: 8px; /* Adjust size as needed */
    background-color: red;
    border-radius: 50%; /* Makes it a perfect circle */
    display: inline-block; /* Allows it to sit next to text */
    animation: blink 1s infinite alternate; /* Blinking animation */
	box-shadow: 0 0 5px 2px rgba(255, 0, 0, 0.7); /* Red glow with slight blur and spread */
    display: inline-block; /* Essential for vertical-align to work on non-text elements */
    vertical-align: middle; /* Align the middle of the dot with the middle of the parent's x-height */
  }
  
  @keyframes blink {
    0% {
      opacity: 1;
    }
    100% {
      opacity: 0.2; /* Fades to a lower opacity */
    }
}

.social-button-img {
    padding-right: 10px;
    max-width: 48px;
    max-height: 48px;
    float: left;
}
.btn {
    border: 1px solid #505050 ;
    background-color: #740700 ;
}

.btn:hover {
	border: 1px solid #505050 ;
	background-color: #a70b00
}