@charset "utf-8";
html {background:#F7EBD8; background-size: cover;height: 100%; width: 100%; margin: 0; padding: 0}
body {text-shadow:#ccc 1px 1px 1px;height: 100%; width: 100%; margin: 0; padding: 0}
.content {position: absolute;width:50%; margin-left:25%;top: 5%;font-family: 'Open Sans', sans-serif;background-color: rgba(255,255,255,0.50);padding: 1%;z-index: 999;}
.content h1 {font-size: 2em;font-weight: 700;}
.content p {	font-size: 1.4em;margin-top: 14px;}
.content a {color: #333;}

.radiostations {width:100%; display: grid; grid-template-columns: repeat(auto-fit, minmax(350px, 1fr))}
.radiostations figure {margin:20px 2%; padding-left:2%;font-size:90%; background: #312013; text-align:center}
.radiostations figcaption {color: #ccc;}
.radiostations audio {background: #000}

#video-bg {position: fixed;top: 0;right: 0;bottom: 0;left: 0;overflow: hidden;z-index: 1;background: #F7EBD8;background-size: cover;}
#video-bg > video {position: absolute;top: 0;left: 0;min-width: 100%; min-height: 100%;width: auto;height: auto; }
@supports (object-fit: cover) {#video-bg > video {top: 0;left: 0;width: 100%;height: 100%;object-fit: cover;}
}
@media (max-width: 1920px) {
.content {width:80%; margin-left:9%;top: 30%}
}
@media (max-width:: 800px) {
.content {width:94%;margin-left:1%;	top: 1%;}
}
@media (max-width: 240px) {
#video-bg > video {display: none;}
}

