pepperprintthis/style.css at master · septor/pepperprintthis · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
@import url('https://fonts.googleapis.com/css2?family=JetBrains+Mono&display=swap');
 html, body, div, a, ul, li, nav {
     margin: 0;
     padding: 0;
     border: 0;
     background-color: #222;
     color: #999;
     font-family: 'JetBrains Mono', monospace;
}
 .wrapper {
     padding: 20px;
     margin-top: 2%;
     text-align: center;
}
 nav {
     display: block;
     text-align: center;
     position: fixed;
     top: 0;
     right: 0;
     left: 0;
     z-index: 9999;
}
 nav ul {
     margin: 0;
     padding:0;
     list-style: none;
}
 .nav a {
     display:block;
     text-decoration: none;
     padding: .8em 1.8em;
     font-size: 75%;
     letter-spacing: 2px;
     position: relative;
}
 .nav {
     vertical-align: top;
     display: inline-block;
     border-radius:6px;
}
 .nav li {
    position: relative;
    font-weight: bold;
}
 .nav > li {
     float:left;
     margin-right: 6px;
}
 .nav > li > a {
     margin-bottom:1px;
}
 .nav li:hover > a {
     background-color: #000;
     color:#00bcd4;
}
 .nav li li a {
     margin-top:1px
}
 .nav li a:first-child:nth-last-child(2):before {
     content:"";
     position: absolute;
     height:0;
     width: 0;
     border: 5px solid transparent;
     top: 50% ;
     right:5px;
}
 .nav ul {
     position: absolute;
     white-space: nowrap;
     z-index: 1;
     left: -99999em;
}
 .nav > li:hover > ul {
     left: auto;
     padding-top: 5px ;
     min-width: 100%;
}
 .nav > li li:hover > ul {
     left: 100%;
     top: -1px;
}
.nav small {
     font-size: 0.8em;
}
 .list {
     margin: auto;
     left: 7px;
}
 .item {
     width: 20%;
     margin-bottom: 15px;
     position: relative;
     border: 2px solid #00bcd4;
}
 .item:hover {
    border: 2px solid #ffc107;
 }
 .item img {
     width: 100%;
     background-color: #fff;
     height: auto;
     vertical-align: top;
}
 .item i {
     font-size: 0.6em;
     font-style: normal;
}