@charset "UTF-8";
.onair {
margin: 0 auto;
}
.onairText {
margin: 0 auto clamp(30px, 4vw, 50px);
}
@media (min-width: 899px) {
.onair {
margin: 20px auto 0;
}
}
.onairText img {
width: min(400px, 80%);
}
h3 {
font-family: 'ToronoGlitchSerif', serif;
font-weight: 900;
font-size: var(--font34);
}
.onair section {
margin: 50px auto 0;
width: min(800px, 90%);
}
.onair section h4 {
font-size: var(--font30);
font-weight: 800;
color: var(--Key-color);
text-shadow: 0 0 6px rgba(0, 0, 0, .7);
}
.onair section.regulate h4 {
font-size: var(--font30);
font-weight: 700;
color: var(--accent-color);
}
.onair section ul.streamingList {
margin: 20px auto 60px;
display: grid;
grid-template-columns: 1fr;
gap: 10px;
}
@media (min-width: 480px) {
.onair section ul.streamingList {
grid-template-columns: 1fr 1fr;
gap: 10px;
padding: 0;
}
}
@media (min-width: 899px) {
.onair section ul.streamingList {
grid-template-columns: 1fr 1fr 1fr;
}
}
.onair section ul.streamingList li {
font-size: var(--font16);
font-weight: 600;
}
.onair section ul.streamingList li a {
display: block;
padding: 15px 0;
background-color: var(--Key-color);
}
.onair section.regulate ul.streamingList li a {
background-color: var(--accent-color);
}
ul.streamingList li a:hover {
color: var(--font-color);
opacity: .7;
}
@media (max-width: 600px) {
footer {
margin: 100px auto 0;
}
}