1
/*! HTML5 Boilerplate v4.3.0 | MIT License | http://h5bp.com/ */
2
3
/*
4
 * What follows is the result of much research on cross-browser styling.
5
 * Credit left inline and big thanks to Nicolas Gallagher, Jonathan Neal,
6
 * Kroc Camen, and the H5BP dev community and team.
7
 */
8
9
/* ==========================================================================
10
   Base styles: opinionated defaults
11
   ========================================================================== */
12
13
html,
14
button,
15
input,
16
select,
17
textarea {
18
    color: #222;
19
}
20
21
html {
22
    font-size: 1em;
23
    line-height: 1.4;
24
}
25
body {
26
    font-size: 14px;
27
}
28
29
/*
30
 * Remove text-shadow in selection highlight: h5bp.com/i
31
 * These selection rule sets have to be separate.
32
 * Customize the background color to match your design.
33
 */
34
35
::-moz-selection {
36
    background: #b3d4fc;
37
    text-shadow: none;
38
}
39
40
::selection {
41
    background: #b3d4fc;
42
    text-shadow: none;
43
}
44
45
/*
46
 * A better looking default horizontal rule
47
 */
48
49
hr {
50
    display: block;
51
    height: 1px;
52
    border: 0;
53
    border-top: 1px solid #ccc;
54
    margin: 1em 0;
55
    padding: 0;
56
}
57
58
/*
59
 * Remove the gap between images, videos, audio and canvas and the bottom of
60
 * their containers: h5bp.com/i/440
61
 */
62
63
audio,
64
canvas,
65
img,
66
video {
67
    vertical-align: middle;
68
}
69
70
/*
71
 * Remove default fieldset styles.
72
 */
73
74
fieldset {
75
    border: 0;
76
    margin: 0;
77
    padding: 0;
78
}
79
80
/*
81
 * Allow only vertical resizing of textareas.
82
 */
83
84
textarea {
85
    resize: vertical;
86
}
87
88
/* ==========================================================================
89
   Browse Happy prompt
90
   ========================================================================== */
91
92
.browsehappy {
93
    margin: 0.2em 0;
94
    background: #ccc;
95
    color: #000;
96
    padding: 0.2em 0;
97
}
98
99
/* ==========================================================================
100
   Author's custom styles
101
   ========================================================================== */
102
103
.news-item-wrapper {
104
  border: 2px solid #DDDDDD;
105
  box-shadow: 0 8px 6px -6px #AAAAAA;
106
  float: left;
107
  height: 120px;
108
  margin: 5px;
109
  padding: 5px;
110
  width: 275px;
111
}
112
.news-title {
113
  font-style: bold;
114
  margin: 10px;
115
}
116
.news-link {
117
  margin: 10px;
118
  font-size: 0.9em;
119
}
120
121
#feeds-loader {
122
  position: absolute;
123
  left: 45%;
124
  top: 45%;
125
}
126
127
.carousel {
128
  background-color: #505050;
129
  border: 1px solid #999;
130
  box-shadow: 1px 1px 3px #999;
131
  min-height: 405px;
132
}
133
134
/* Navigation and Layout related CSS */
135
.navbar-nav {
136
  position: relative;
137
  top: -35px;
138
}
139
.nav .nav-item {
140
  max-width: 160px;
141
  min-width: 90px;
142
}
143
.nav .nav-item-icon {
144
  height: 44px;
145
  width: 38px;
146
  background: url('/static/img/nav-item.svg') no-repeat;
147
}
148
.nav .nav-item-icon.active {
149
  height: 44px;
150
  width: 45px;
151
  position: relative;
152
  top: -7px;
153
  background: url('/static/img/nav-item-active.svg') no-repeat;
154
}
155
156
.nav>li>a:hover {
157
  text-decoration: underline;
158
  background: none;
159
}
160
.nav-icon {
161
  width: 100px;
162
  height: 130px;
163
  position: relative;
164
  top: -20px;
165
}
166
#header-banner {
167
  font-size: 30px;
168
  border-bottom: 1px solid black;
169
}
170
171
/* Global styles for site wide */
172
a {
173
  color: #000;
174
}
175
a:hover, a:active {
176
  color: #000;
177
  text-decoration: underline;
178
}
179
body {
180
  font-family: "";
181
  background: url('/static/img/background.png') repeat;
182
}
183
.container {
184
  /*margin: 0;*/
185
}
186
187
/* ==========================================================================
188
   Helper classes
189
   ========================================================================== */
190
191
/*
192
 * Image replacement
193
 */
194
195
.ir {
196
    background-color: transparent;
197
    border: 0;
198
    overflow: hidden;
199
    /* IE 6/7 fallback */
200
    *text-indent: -9999px;
201
}
202
203
.ir:before {
204
    content: "";
205
    display: block;
206
    width: 0;
207
    height: 150%;
208
}
209
210
/*
211
 * Hide from both screenreaders and browsers: h5bp.com/u
212
 */
213
214
.hidden {
215
    display: none !important;
216
    visibility: hidden;
217
}
218
219
/*
220
 * Hide only visually, but have it available for screenreaders: h5bp.com/v
221
 */
222
223
.visuallyhidden {
224
    border: 0;
225
    clip: rect(0 0 0 0);
226
    height: 1px;
227
    margin: -1px;
228
    overflow: hidden;
229
    padding: 0;
230
    position: absolute;
231
    width: 1px;
232
}
233
234
/*
235
 * Extends the .visuallyhidden class to allow the element to be focusable
236
 * when navigated to via the keyboard: h5bp.com/p
237
 */
238
239
.visuallyhidden.focusable:active,
240
.visuallyhidden.focusable:focus {
241
    clip: auto;
242
    height: auto;
243
    margin: 0;
244
    overflow: visible;
245
    position: static;
246
    width: auto;
247
}
248
249
/*
250
 * Hide visually and from screenreaders, but maintain layout
251
 */
252
253
.invisible {
254
    visibility: hidden;
255
}
256
257
/*
258
 * Clearfix: contain floats
259
 *
260
 * For modern browsers
261
 * 1. The space content is one way to avoid an Opera bug when the
262
 *    `contenteditable` attribute is included anywhere else in the document.
263
 *    Otherwise it causes space to appear at the top and bottom of elements
264
 *    that receive the `clearfix` class.
265
 * 2. The use of `table` rather than `block` is only necessary if using
266
 *    `:before` to contain the top-margins of child elements.
267
 */
268
269
.clearfix:before,
270
.clearfix:after {
271
    content: " "; /* 1 */
272
    display: table; /* 2 */
273
}
274
275
.clearfix:after {
276
    clear: both;
277
}
278
279
/*
280
 * For IE 6/7 only
281
 * Include this rule to trigger hasLayout and contain floats.
282
 */
283
284
.clearfix {
285
    *zoom: 1;
286
}
287
288
/* ==========================================================================
289
   EXAMPLE Media Queries for Responsive Design.
290
   These examples override the primary ('mobile first') styles.
291
   Modify as content requires.
292
   ========================================================================== */
293
294
@media only screen and (min-width: 35em) {
295
    /* Style adjustments for viewports that meet the condition */
296
}
297
298
@media print,
299
       (-o-min-device-pixel-ratio: 5/4),
300
       (-webkit-min-device-pixel-ratio: 1.25),
301
       (min-resolution: 120dpi) {
302
    /* Style adjustments for high resolution devices */
303
}
304
305
/* ==========================================================================
306
   Print styles.
307
   Inlined to avoid required HTTP connection: h5bp.com/r
308
   ========================================================================== */
309
310
@media print {
311
    * {
312
        background: transparent !important;
313
        color: #000 !important; /* Black prints faster: h5bp.com/s */
314
        box-shadow: none !important;
315
        text-shadow: none !important;
316
    }
317
318
    a,
319
    a:visited {
320
        text-decoration: underline;
321
    }
322
323
    a[href]:after {
324
        content: " (" attr(href) ")";
325
    }
326
327
    abbr[title]:after {
328
        content: " (" attr(title) ")";
329
    }
330
331
    /*
332
     * Don't show links for images, or javascript/internal links
333
     */
334
335
    .ir a:after,
336
    a[href^="javascript:"]:after,
337
    a[href^="#"]:after {
338
        content: "";
339
    }
340
341
    pre,
342
    blockquote {
343
        border: 1px solid #999;
344
        page-break-inside: avoid;
345
    }
346
347
    thead {
348
        display: table-header-group; /* h5bp.com/t */
349
    }
350
351
    tr,
352
    img {
353
        page-break-inside: avoid;
354
    }
355
356
    img {
357
        max-width: 100% !important;
358
    }
359
360
    @page {
361
        margin: 0.5cm;
362
    }
363
364
    p,
365
    h2,
366
    h3 {
367
        orphans: 3;
368
        widows: 3;
369
    }
370
371
    h2,
372
    h3 {
373
        page-break-after: avoid;
374
    }
375
}