@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:ital,wght@0,400;0,700;1,400;1,700&family=Source+Code+Pro:ital,wght@0,200..900;1,200..900&display=swap');

html, body, p, ol, ul, li, dl, dt, dd, blockquote, figure, fieldset, legend, textarea, pre, iframe, hr, h1, h2, h3, h4, h5, h6 {margin:0; padding:0;}
h1, h2, h3, h4, h5, h6 {font-size:100%; font-weight:normal;}
ul {list-style: none; padding: 0;}
li {margin-bottom: 10px;}
button, input, select {margin:0;}
html {box-sizing:border-box;}
*, *::before, *::after {box-sizing:inherit;}
img, video {height:auto; max-width:100%;}
iframe {border:0;}
table {border-collapse:collapse; border-spacing:0;}
td, th {padding:0;}

body {font-family:'IBM Plex Mono', monospace; background-color:#011826; background-image: url('../img/retrowavebg_1.jpg'); background-size: cover; color:#f0f0f0; display: flex; flex-direction:column; align-items: center; height: 100vh; margin: 0;}
a:link {color: #ccc;}

.header {text-align: center; padding: 1em;}
.info {font-size: 0.6em; color: #66ffcc;}

.container {align-self: center; /*background-color:#1c2d3b; padding: 2em;*/ width: 50%; margin: auto 0; /*border-radius: 0.5em;*/}

.search-container {font-family: 'IBM Plex Mono', monospace!important;}
.search-container form {display: flex; margin-bottom: 1em; font-family: 'IBM Plex Mono', monospace!important;}
.search-container input {flex: 1; padding: 0.75em; border:1px solid #00ffcc; outline: none; background: #333; color: #f0f0f0;}
.search-container button {padding: 10px; border: 1px solid #00ffcc; border-left: none; background-color: #000; color: #ccc; cursor: pointer;}

.tabs {display: flex; justify-content: center; margin-bottom: 0.5em;}
.tab-link {padding: 10px; cursor: pointer; background-color: transparent; border: none; outline :none; margin-right:5px; text-align: center; text-decoration: none; color: #00ffcc;}
.tab-link:hover {text-decoration: underline;}

.tab-content {padding: 1em; /*background-color:#010a11;*/ flex-wrap: wrap;}
.tab-content:target {display: flex;}
.tab-content a {color: #00ffcc; text-decoration: none;}
.tab-content a:hover {color:#ff00ff; text-decoration: underline;}
.tab-content a:active {color: #ff4500;}


.linkage {list-style-type: none; padding: 0; margin: 0; display: flex; justify-content: center;}
.linkage li {margin-right: 1em;}
.linkage li:last-child {margin-right: 0;}
.linkage li img {width: 10px; height: 10px; margin-right: 10px;}

.days-counter {margin-top: 20px; text-align: center; font-size: 0.8em;}
footer {margin: 0 auto; text-align: center; font-size: 0.5em; color: #ccc; padding: 1em;}