-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathstyle.css
96 lines (92 loc) · 3.12 KB
/
style.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
body{
/* vars */
--BORDER: rgba(250, 250, 250, 0.075);
--BORDERHOVER: rgba(250, 250, 250, 0.175);
--BG: #332a41;
--FG: rgba(250, 250, 250, 0.075);
--FONT: monospace;
--FONT-COLOR: #fff;
margin:0 0 0 0 !important;
}
a{text-decoration: none;}
/* content div */
.content{
--margin: 30px;
margin-left:var(--margin);margin-top:var(--margin);margin-right:var(--margin);margin-bottom:var(--margin);
padding: var(--margin);
font-family: var(--FONT);
background-color: var(--FG);
border-color: var(--BORDER);
border-width: 2px;
border-style: solid;
border-radius: var(--margin);
backdrop-filter: blur(15px);
}
.content #full {
min-height: 91.2vh !important;
}
.content p{
font-size: 125%;
}
h1, h2, h3, h4, h5, h6, p {
color:var(--FONT-COLOR);
}
.content h1{
font-size: 175%;
font-weight: 550;
}
.content h3{
font-size: 155%;
font-weight: 535;
}
.content a {color:rgb(0, 174, 255)}
body{background: linear-gradient(rgba(0, 0, 0, 0.75), rgba(0, 0, 0, 0.75)), url(https://c4.wallpaperflare.com/wallpaper/531/951/621/digital-digital-art-artwork-illustration-minimalism-hd-wallpaper-preview.jpg); background-size: cover;background-position: top 15vh;}
ul{color: var(--FONT-COLOR);}
/* game gallery */
div.gallery {
border: 2px solid var(--BORDER);
border-radius: 7.5px;
float: left;
height: 35vh;/*360px*/
width: 100%;
transition: border-color 0.5s;
}
div.gallery img {
height: 75%;
object-fit:cover;
width: 100%;
border-radius: 6.5px 6.5px 0px 0px;
}
div.gallery:hover{border-color: var(--BORDERHOVER);}
.gamesa{text-align: center;}
.desc {
text-align: center;
color: var(--FONT-COLOR);
position: relative;
top: calc(25% - (4em) );
}
.row{padding:15px 0px 15px 0px;}
.row {display: -webkit-flex;display: flex;}
.column{margin: 0 15px 0 15px;}
.column.side {-webkit-flex: 1;-ms-flex: 1;flex: 1;}
/*topnav*/
.topnav{--margin: 20px;padding-left:var(--margin);padding-top:var(--margin);padding-right:var(--margin);padding-bottom:var(--margin);background-color: rgba(0, 0, 0, 0.4);width: calc(100% - (var(--margin)*2)}
.spacer{flex: 1 auto;margin: 0;padding: 0;box-sizing: border-box;}
.topnav h2 {margin: 0;padding: 0;box-sizing: border-box;}
.topnav a img{size: 3px;}
.topnav{position: sticky;bottom: 00px;}
.logo {position: absolute;top: 36%; text-decoration: none; color:#f0f0f0;font-size: 200%;font-family: monospace;font-weight: 600;}
.link {position: sticky;top: -1.7vh; text-decoration: none;font-size: 150%;color:#f0f0f0;}
.topnav{position: sticky;height: 5vh;}
.topnav img {transition: filter 0.25s; filter:brightness(0.635) ;margin: 3px 3px 3px 3px;height:45px;}
.topnav img:hover{filter:brightness(1);}
.topnav .logo{transition: color 0.25s;text-decoration: none;}
.topnav .logo:hover{color: rgb(156, 224, 255);}
header{position: sticky;}
/*scrollbar*/
body{
--sc-width:15px;
--sc-radius:5px;
--sc-color:rgb(112, 112, 112);
--sc-bg:rgb(63, 63, 63);
}::-webkit-scrollbar{width: var(--sc-width);}::-webkit-scrollbar-track{/*border-radius:var(--sc-radius);*/background:var(--sc-bg);}::-webkit-scrollbar-thumb{background:var(--sc-color);border-radius:var(--sc-radius);}