kdy.ch
1html {
2 margin: 0;
3 padding: 0;
4}
5
6body {
7 align-items: center;
8 background: #DF8AAC;
9 background: -webkit-linear-gradient(135deg, #DF8AAC, #B63A74);
10 background: linear-gradient(135deg, #DF8AAC, #B63A74);
11 display: flex;
12 justify-content: center;
13 margin: 0;
14 min-height: 100vh;
15}
16
17.content {
18 background-color: rgba(255, 255, 255, 0.8);
19 font-family: Arial, Helvetica, sans-serif;
20 font-size: 0.8rem;
21 max-width: 420px;
22 padding: 1rem 2rem;
23 text-align: center;
24 width: 100%;
25}
26
27a {
28 border-bottom: 1px dotted #0074D9;
29 color: #0074D9;
30 text-decoration: none;
31}
32
33a:hover {
34 border-bottom: 1px solid #0074D9;
35 color: #0074D9;
36 text-decoration: none;
37}
38
39h1 {
40 background: transparent url(https://rita.moe/rita-icon.png) no-repeat scroll left center;
41 background-size: contain;
42 font-family: Verdana, sans-serif;
43 font-size: 3em;
44 font-weight: bold;
45 margin-top: 3px;
46 padding: 10px 0px 10px 60px;
47 text-decoration: none;
48}
49
50h3 {
51 font-family: Verdana, sans-serif;
52 font-size: 1.5em;
53 font-weight: bold;
54 margin: 0px;
55 padding: 0px;
56}
57
58h3 small {
59 color: #AAA;
60 font-size: 70%;
61 padding-left: 5px;
62}
63
64.roundbox {
65 background-color: #fff;
66 border-radius: 10px;
67 margin-bottom: 35px;
68 padding: 15px 20px;
69}
70
71.roundbox h3 {
72 border-bottom: 1px groove #ACACAC;
73 margin-bottom: 10px;
74}
75
76.right {
77 float: right;
78}
79
80.mounthead h3 {
81 border-bottom: none;
82 float: left;
83 margin-bottom: 0px;
84}
85
86.mountcont {
87 border-top: 1px groove #ACACAC;
88 clear: both;
89}
90
91ul.mountlist {
92 list-style: none;
93 margin: 0;
94 padding: 0;
95 text-align: right;
96}
97
98.mountlist li {
99 display: inline;
100}
101
102a.play {
103 background: transparent url(/tunein.png) no-repeat scroll left center;
104 background-size: auto 100%;
105 border: none;
106 margin-left: 25px;
107 padding-left: 22px;
108}
109
110a.auth {
111 background: transparent url(/key.png) no-repeat scroll left top;
112 background-size: auto 100%;
113 border: none;
114 margin-left: 25px;
115 padding-left: 22px;
116}
117
118.audioplayer {
119 margin-top: 5px;
120}
121
122.audioplayer .plyr__controls {
123 justify-content: center;
124}
125
126.audioplayer .plyr__volume {
127 width: 110px;
128}
129
130.audioplayer .plyr__controls .plyr__controls__item:first-child {
131 margin-right: 0;
132}
133
134.audiooplayer .plyr__controls .plyr__controls__item.plyr__time {
135 flex-grow: 1;
136 text-align: left;
137}
138
139#footer {
140 border-top: 1px groove #ACACAC;
141 font-size: 80%;
142 margin-top: 20px;
143}
144
145@media screen and (max-width: 520px) {
146 body {
147 display: block;
148 min-height: calc(100vh - 2rem);
149 padding: 1rem;
150 }
151
152 .content {
153 max-width: none;
154 padding: 1rem;
155 width: auto;
156 }
157
158 h1 {
159 font-size: 1.5em;
160 padding: 10px 0px 10px 50px;
161 text-align: left;
162 }
163
164 a.play {
165 margin-left: 15px;
166 }
167}