forked from synrc/n2o.dev
-
Notifications
You must be signed in to change notification settings - Fork 0
/
blank.css
103 lines (88 loc) · 4.83 KB
/
blank.css
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
// Basic Blank CSS for entire SYNRC space
.dropbtn { cursor: pointer; }
.dropdown { display: inline-block; color: #5BC2E7;}
.dropdown-content { margin-top: 10px; display: none; margin-left: -5px; padding: 5px; position: absolute; }
.dropdown-content a { display: block; background: white; }
.dropdown > a { padding: 5px 12px }
.show {display:block;}
.dropdownLANG {display:inline-block;}
* { box-sizing: border-box; margin: 0; padding: 0; }
@font-face { src: url('https://tonpa.guru/Geometria-Light.otf');
font-family: 'local'; font-weight: normal; font-style: normal; }
body { background-color: white; font-family: 'local', sans-serif; font-size: 16px; }
hr { margin-top: 10px; margin-bottom: 10px; }
h1, h2, h3, h4 { font-weight: normal; border-left: 2px solid #5BC2E7; }
nav { padding: 20px 0 20px 0; display: block; position: fixed; width: 100%; background-color: white;
display: float; text-align: center; align-items: center; }
nav a:visited { color: #5BC2E7; }
nav a:hover { border-bottom: 2px solid #5BC2E7; }
nav a { font-size: 16px; border: 2px solid #dedede; cursor: pointer; text-decoration: none;
margin: 5px 5px; padding: 7px 12px; text-align: center; color: #5BC2E7; }
header { padding-top: 80px; padding-bottom: 40px; text-align: center; background-color: white; }
header img { margin-right: 15px; margin-bottom:-25px; width: 100px; }
header h1 { line-height: 1; margin: 40px 0px 40px 0px; padding-left: 20px;
font-size: 38px; display: inline-block; text-align: left; }
footer { text-align: center; background-color: white; color: black; padding: 50px 0 100px 0; }
aside h3 { font-size: 28px; text-transform: uppercase; color: #5BC2E7; margin: 0px; padding: 20px 0 10px; margin-bottom: 20px; }
aside div { color: black; }
aside img { width: 20px; vertical-align: middle; }
aside a { text-decoration: none; color: #5BC2E7; }
aside a:visited { color: #5BC2E7; }
aside a:hover { background: rgba(255, 255, 255, 0.3); }
aside { text-align: center; padding: 0 10px 100px; }
aside h3 { margin-left: 0px; border-left: none; }
aside section { margin: auto; max-width: 650px; padding: 20px 0 0 0;
display: inline-block; vertical-align: top; text-align: left; padding-right: 30px; }
main section { padding: 20px 0px 20px 0; text-align: left; }
main section:nth-of-type(even) { background-color: white; }
main p { max-width: 850px; margin: 20px; line-height: 1.3; }
main a { color: #5BC2E7; text-decoration: none; margin: 0; border-bottom: 1px solid green; }
main a:visited { color: #5BC2E7; border-bottom: 1px solid #5BC2E7; }
main a:hover { background: rgba(71, 144, 256, 0.13); }
main ul { list-style-type: none; max-width: 850px; margin: 20px; }
main b { color: #121212; font-weight: bold; }
main h3 { line-height: 1; font-size: 32px; padding-left: 20px; max-width: 850px; }
main h4 { line-height: 1; font-size: 24px; padding-left: 20px; max-width: 850px; }
figure { margin: 10px auto; max-width: 100%; text-align: center; }
figcaption { padding: 5px 20px; text-transform: uppercase; font-size: 1rem; text-align: center; }
figcaption > b { text-transform: lowercase }
figure img { max-width: 100%; padding: 0px; }
figure code { font-family: monospace; font-size: 12px; display: block; max-width: 100%;
overflow-x: auto; padding: 10px; background-color: white;
white-space: pre; text-align: left; }
figure pre { font-family: monospace; font-size: 12px; overflow-x: auto; max-width: 100%;
padding: 0 20px; white-space: pre-wrap; text-align: left; }
.desk { display: none; }
.heart { color: red; }
li { list-style-position: inside; }
@media(min-width: 550px) {
nav { padding: 10px 0 10px 0; display: flex; justify-content: center; line-height: 1; }
nav a { font-size: 18px; min-width: initial; }
header h1 { font-size: 30px; }
figure { max-width: 100%; }
figure code { max-width: 100%; font-size: 12px; }
figure img { max-width: 100%; border: 0px solid #E8E8E8; }
}
@media(min-width: 768px) {
body { font-size: 18px; }
li { list-style-position: inside; }
header h1 { font-size: 50px; margin: 70px 0 100px; }
main h3 { font-size: 36px; margin: 40px auto; }
main h4 { font-size: 24px; margin: 40px auto; }
main p { margin: 20px auto; }
main ul { margin: 20px auto; }
figure { max-width: 70%; }
figure code { max-width: 100%; font-size: 14px; }
figure img { max-width: 100%; border: 10px solid #E8E8E8; }
}
@media(min-width: 1280px) {
.desk { display: inline-block; }
li { list-style-position: outside; }
body { font-size: 20px; }
header h1 { font-size: 70px; margin: 100px 0 150px; }
main section { max-width: 1200px; margin-left: auto; margin-right: auto; }
main h3 { font-size: 44px; }
figure { max-width: 70%; }
figure code { max-width: 100%; font-size: 16px; }
figure img { max-width: 100%; border: 10px solid #E8E8E8; }
}