nani/website/css/device.css

device.css

1
@media (max-width: 900px) {
2
  footer > * {
3
    padding: 5px;
4
    width: auto;
5
  }
6
  .footer-flex {
7
    display: block;
8
  }
9
  .article {
10
    padding: 5px;
11
    width: auto;
12
  }
13
14
  #features {
15
    display: block;
16
    width: auto;
17
  }
18
}
19
20
@media (max-width: 800px) {
21
  #hamburger-label {
22
    display: block;
23
    color: var(--black);
24
    position: absolute;
25
    right: 2em;
26
    top: 20px;
27
  }
28
29
  #hamburger-label img {
30
    height: 32px;
31
  }
32
33
  #hamburger ~ ul {
34
    display: none;
35
  }
36
37
  #hamburger:checked ~ ul {
38
    display: block;
39
  }
40
41
  header {
42
    align-items: start;
43
  }
44
45
  header span {
46
    font-size: 2.7em;
47
  }
48
49
  #hero {
50
    background: url('/images/screen.png') no-repeat -70px -50px #dde2dd;
51
    background-size: 300px;
52
    padding-bottom: 15px;
53
    padding-left: 15px;
54
    position: absolute;
55
    top: 0px;
56
  }
57
58
  #hero h1 {
59
    text-align: right;
60
    margin-top: 6em;
61
    text-shadow: 1px 1px #00574B
62
  }
63
64
  #after-hero {
65
    margin-top: 10em;
66
  }
67
}
68