style.css - adamsgaard.dk - my academic webpage
HTML git clone git://src.adamsgaard.dk/adamsgaard.dk
DIR Log
DIR Files
DIR Refs
DIR README
DIR LICENSE
---
style.css (2936B)
---
1 html {
2 overflow-y: scroll;
3 }
4 body {
5 background-color: #000084;
6 color: #bbb;
7 font-size: 1.0em;
8 line-height: 1.3;
9 font-family: monospace;
10 font-variant-ligatures: none;
11 margin: 0;
12 padding: 0;
13 }
14 /* HTML5 semantic tags: some (older) browsers display this inline by default */
15 article, figcaption, figure, header, main, nav {
16 display: block;
17 }
18 article {
19 margin: 5px;
20 }
21 footer {
22 margin: 20px;
23 text-align: center;
24 }
25 table, img {
26 border: 0;
27 }
28 hr {
29 border: 0;
30 border-bottom: 3px solid #aaa;
31 height: 3px;
32 }
33 h1 {
34 text-align: center;
35 margin-top: 3em;
36 font-size: 100%;
37 font-weight: bold;
38 text-transform: uppercase;
39 color: #fff;
40 }
41 h2 {
42 text-transform: uppercase;
43 margin-top: 2em;
44 font-size: 100%;
45 font-weight: bold;
46 color: #fff;
47 }
48 h3 {
49 margin-top: 2em;
50 font-size: 100%;
51 font-weight: bold;
52 }
53 p {
54 /* text-align: justify; */
55 /* text-justify: inter-word; */
56 }
57 h1,
58 h1 a,
59 h1 a:visited,
60 h2,
61 h2 a,
62 h2 a:visited,
63 h3,
64 h3 a,
65 h3 a:visited,
66 h1 a:hover,
67 h2 a:hover,
68 h3 a:hover {
69 color: inherit;
70 text-decoration: none;
71 }
72 table tr td {
73 padding: 2px 10px 2px 0px;
74 }
75 pre {
76 margin: 0;
77 }
78 code {
79 color: #000;
80 background-color: #aaa;
81 border: 3px solid #aaa;
82 display: block;
83 overflow-x: auto;
84 padding: 5px;
85 word-wrap: normal;
86 }
87 li {
88 margin: 0.5em 0;
89 }
90 .welcome {
91 white-space: pre;
92 color: #5f5;
93 animation: color-change 5s infinite;
94 }
95
96 @keyframes color-change {
97 0% { color: #5f5; }
98 40% { color: #5f5; }
99 49% { color: #55f; }
100 50% { color: #f5f; }
101 90% { color: #f5f; }
102 100% { color: #55f; }
103 }
104
105 @media (prefers-reduced-motion: reduce) {
106 .welcome {
107 animation: none;
108 }
109 }
110 .btn {
111 display: incline-block;
112 text-align: center;
113 vertical-align: middle;
114 box-shadow: 5px 5px 0 #000;
115 border-radius: 4px;
116 background: #aaa;
117 color: #000;
118 padding: 2px 5px 2px 5px;
119 }
120 .btn:active,
121 .btn.active {
122 background-color: #aaa !important;
123 position: relative;
124 top: 2px;
125 left: 2px;
126 box-shadow: 3px 3px 0 #000;
127 }
128 .btn:hover,
129 .btn.hover {
130 /* background-color: #fff; */
131 }
132 #title {
133 background-color: #707;
134 padding: 1ex 10px;
135 font-size: 1.0em;
136 line-height: 1.3;
137 font-family: monospace;
138 border-bottom: 0px solid #aaa;
139 width: 100%;
140 }
141 #menu {
142 background-color: #909;
143 width: 100%;
144 }
145 #menu td {
146 padding: 2px 10px 5px 5px;
147 line-height: 2.0;
148 /* padding: 1ex 10px 10px 1ex; */
149 }
150 #menuwrap,
151 #menu,
152 #main {
153 margin: 0px auto;
154 max-width: 100ex;
155 }
156 #menu a {
157 font-weight: bold;
158 vertical-align: middle;
159 text-decoration: none;
160 }
161 #main {
162 border-top: 0px solid #aaa;
163 }
164 a {
165 color: #bbb;
166 } .hidden {
167 display: none;
168 }
169 .mediaframe {
170 max-width: 300px;
171 max-height: 200px;
172 border: 0;
173 }
174 video[poster] {
175 width: 100%;
176 height: 100%;
177 }
178 figure {
179 margin-top: 2em;
180 margin-bottom: 2em;
181 margin-left: 40px;
182 margin-right: 40px;
183 max-width: 80%;
184 }
185 .pagefigure {
186 text-align: center;
187 margin-left: auto;
188 margin-right: auto;
189 }
190 .pageimg {
191 border: 2px solid #aaa;
192 max-width: 100%;
193 }
194 .alignright {
195 text-align: right;
196 vertical-align: bottom;
197 }