@font-face {font-family: galacticstormlaser; src: url('../../../fonts/galacticstormlaser.ttf') format('truetype');font-weight: normal;font-style: normal;}
@font-face {font-family: OpenSans; src: url('../../../fonts/OpenSans-Regular.ttf') format('truetype');font-weight: normal;font-style: normal;}

/* radio */
#audiot, #radioo audio {z-index:-9999;position: absolute;top:-3000px;}
#radioo {text-transform: uppercase; padding: 0;width: 95%;background-color: #f7f7f799;height: 121px;max-width: 450px;width: 100%;}
#radioo button {border-radius: 0;padding: 4px;width: 60px;height: 60px;}
#radio span {text-align: center;padding: 5px;background-color: #00000055;color: #fff;}
#rad_btns {width: 60px;float: left;}
#rad_buffered {width: 100%; height: 4px; background-color: #00000055;margin-top: -4px;}
#rad_played {width: 100%; height: 4px; background-color: #ff0066bb;}
#rad_nfo {margin:12px 7px 7px 55px;overflow: hidden;padding: 12px;}
#rad_nfo li {float: left;}
#rad_more {position: absolute: bottom: 0;right: 0;display: inline-block;margin: 0;background-color: #ffffff88;}
#rad_time {background-color: #000000ff;color: #ffffffdd;padding: 3px 4px 1px 4px;text-align: right; margin: 0;display: inline-block;float: right;}
#rad_timebar {width: 100%;padding: 0;}
#btn-play {float: left;font-weight: bold;}

article {background: #ffffff44;min-height: 85vh;}
article img {width: 100%; height: auto;}
article p {padding:0 1em 0.5em 1em;}
body {margin: 0;background:fixed #bbb url(../images/1.jpg)no-repeat center center;background-size: cover;}
button {border: none;touch-action: manipulation;}
button:hover, button:focus {transition: background-color 0.5s ease-in-out;}
.container, footer div {max-width: 450px;width: 100%;margin: 0 auto;}
.edit {position: absolute;top: 10px;right:10px;}
.left {float:left;}
h2 {margin: 5px 0 0 0;padding: 10px 10px;}
main {margin:0 auto;}
.site-header {background-color: #000000;max-width: 450px; width:100%;height:30px;margin-top:-5px;}

/* typography & button stuff */
button {font-size: 22px;font-style: sans-serif;border: none;}
button, input, optgroup, select, textarea {box-sizing: border-box; max-width: 100%; margin: 0; color: #000000; font-family: system-ui, -apple-system, "Segoe UI", Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol"; line-height: 1.375;vertical-align: baseline;}
button::-moz-focus-inner, [type=button]::-moz-focus-inner, [type=reset]::-moz-focus-inner, [type=submit]::-moz-focus-inner {padding: 0; border-style: none;}
button, [type=button], [type=reset], [type=submit] {background-color: #dfdfdf33;background-image: linear-gradient(#eeeeee22, #dfdfdf22);display: inline-block;position: relative;width: auto;height: 2em;padding: 0.25em 1em;border: none;border-radius: 1em;background-clip: padding-box;box-shadow: 0 2px 0 #ffffff00;color: #000000;font-weight: normal;text-align: center; -webkit-appearance: none; -moz-appearance: none;appearance: none;cursor: pointer;}
button:hover, [type=button]:hover, [type=reset]:hover, [type=submit]:hover {background-color: #fff;
color: #000000;text-decoration: none;}
button:active, [type=button]:active, [type=reset]:active, [type=submit]:active {top: 2px;border-color: #bebebe;box-shadow: none;color: #1a1a1a;text-decoration: none;}
button:focus, [type=button]:focus, [type=reset]:focus, [type=submit]:focus {border-color: #0066ff22;outline: 1px solid transparent;}
button[disabled], [type=button][disabled], [type=reset][disabled], [type=submit][disabled] {top: 2px !important;}
body {font: 13px OpenSans, sans-serif;line-height: 1.3em;}
h1, h2, h3, h4, h5, h6 {text-transform: lowercase;}
h2 {font-family: galacticstormlaser, sans-serif;font-weight: normal;font-size: 40px;letter-spacing: 0.05em;}
footer {position: fixed;z-index: 2;bottom: 0;width: 100vw;text-align: center;background-color: #000;padding: 2px 0;color: #fff;}
footer div {font-size: 10px;text-align: left;}
#rad_more {font-weight: bold;font-size: 24px;}
#rad_time {font-size: 10px;}



/* links */
a, a:visited {color: #000;text-decoration: none;font-weight: bold;}
a:hover {transition: color 0.3s ease-in-out;}
h2 a, h2 a:visited {color: #00c0ff;}
#radioo a, #radioo a:visited {color: #f06;text-decoration: none;}
h2 a:hover {color: #fff;}