[I45-website] Refresh HPR layout with a light touch #218
@ -253,31 +253,50 @@ pre.comment {
|
||||
line-height: 1.2rem;
|
||||
}
|
||||
|
||||
h3.title { margin: 1.25rem 0 0.75rem 0 }
|
||||
p.meta { margin: 0.25rem 0 }
|
||||
p.summary { margin: 0.25rem 0 }
|
||||
p.listen-in { margin-top: 0 }
|
||||
table.hosts {
|
||||
font-size: clamp(0.82rem, -0.25rem + 3vw , 1.0rem);
|
||||
width: 100%;
|
||||
background: white;
|
||||
margin: 0 auto;
|
||||
border-collapse: collapse;
|
||||
display: inline-table;
|
||||
|
||||
@media only screen and (max-width: 680px) {
|
||||
#container {width: 95%;}
|
||||
img#hprlogo {float: left; max-width: 85px; padding: .35em;}
|
||||
.column {width: 15%;}
|
||||
h1 {font-size: 140%;}
|
||||
h2 {font-size: 120%;}
|
||||
h3 {font-size: 100%;}
|
||||
nav.column { display: block; padding: 0em .25em 0em .25em;}
|
||||
#footer_page li {font-size: 85%; padding: .5em .25em .5em .25em;}
|
||||
footer p {font-size: 75%;}
|
||||
audio {float: none; }
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 479px) {
|
||||
body {background: #ffffff; color: #4D4D4D; font-family: Verdana, Arial, Helvetica, sans-serif;/* 1em/1.5 OpenDyslexic, */}
|
||||
li {font-size: 100%; padding: .75em 0em .75em 0em; margin-left: -.25em;}
|
||||
img#hprlogo {float: left; max-width: 65px; padding: .35em;}
|
||||
.column {width: auto;}
|
||||
h1#sitename { clear: both;}
|
||||
a:link {text-decoration: none;}
|
||||
audio {padding: .7em 0em .5em 0em; width: 95%; max-width: 300px;}
|
||||
.audcredit { font-size: 65%; margin-bottom: 1em;}
|
||||
table.hosts tr:nth-child(even) {
|
||||
background-color:#cccccc;
|
||||
border-bottom: thick solid white;
|
||||
}
|
||||
|
||||
table.hosts tr:nth-child(odd) {
|
||||
background-color:white;
|
||||
border-bottom: thick solid white;
|
||||
}
|
||||
|
||||
table.hosts tr td img {
|
||||
vertical-align:middle;
|
||||
max-height: 80px;
|
||||
}
|
||||
|
||||
table.hosts th:first-child,
|
||||
table.hosts td:first-child {
|
||||
min-width: 60px;
|
||||
max-width: 80px;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
table.hosts th:nth-child(2),
|
||||
table.hosts td:nth-child(2) {
|
||||
text-align: left;
|
||||
padding-left: clamp(0.15rem, -0.25rem + 3vw, 0.5rem);
|
||||
}
|
||||
|
||||
table.hosts th:nth-child(3),
|
||||
table.hosts td:nth-child(3),
|
||||
table.hosts th:nth-child(4),
|
||||
table.hosts td:nth-child(4) {
|
||||
width: 10%;
|
||||
padding-right: clamp(0.10rem, -0.25rem + 3vw, 1rem);
|
||||
}
|
||||
|
||||
}
|
||||
|
Loading…
Reference in New Issue
Block a user