a : link {
color : # D7F ;
font-size : 0 . 8em ;
}
a : visited {
color : # D7F ;
font-size : 0 . 8em ;
}
a : hover {
color : white ;
font-size : 0 . 8em ;
}
a . nounderline : link {
text-decoration : none ;
}
a . nounderline : visited {
text-decoration : none ;
}
a . nounderline : hover {
text-decoration : none ;
}
h2 {
font-size : 3em ;
}
. generateTime {
font-size : 10px ;
color : blue ;
}
. codeForeground {
font-family : 'Courier New' , Courier , monospace ;
position : fixed ;
left : -12px ;
top : -8px ;
z-index : -4999 ;
color : rgba ( 0 , 0 , 0 , 0 ) ;
background : linear-gradient ( 90deg , rgba ( 17 , 17 , 17 , 1 ) 0 % , rgba ( 17 , 17 , 17 , 1 ) 42 % , rgba ( 17 , 17 , 17 , 0 . 6825105042016807 ) 44 % , rgba ( 17 , 17 , 17 , 1 ) 46 % , rgba ( 17 , 17 , 17 , 1 ) 100 % ) ;
background-size : 300 % 100 % ;
user-select : none ;
animation-name : backgroundMove ;
animation-duration : 15s ;
animation-iteration-count : infinite ;
font-size : 32px ;
overflow : hidden ;
max-width : 98vw ;
max-height : 90vh ;
}
. codeBackground {
font-family : 'Courier New' , Courier , monospace ;
position : fixed ;
left : -12px ;
top : -8px ;
color : # 44FF44 ;
z-index : -5000 ;
user-select : none ;
font-size : 32px ;
overflow : hidden ;
max-width : 98vw ;
max-height : 90vh ;
}
@ keyframes backgroundMove {
0 % {
background-position : 0 % 50 % ;
}
100 % {
background-position : 100 % 50 % ;
}
}
body {
font-family : 'Trebuchet MS' , Garamond , serif , 'Tahoma' , system-ui , -apple-system , BlinkMacSystemFont , 'Segoe UI' , Roboto , Oxygen , Ubuntu , Cantarell , 'Open Sans' , 'Helvetica Neue' , sans-serif ;
background-color : # 111 ;
}
sub {
font-size : 0 . 65em ;
position : relative ;
bottom : -4px ;
}
sup {
font-size : 0 . 65em ;
position : relative ;
top : -8px ;
}
. contentBody {
backdrop-filter : blur ( 4px ) ;
color : # a985e4 ;
font-weight : 900 ;
text-shadow : 0 . 3px 0 . 3px 3px # 666666 ;
z-index : -1 ;
padding-top : 32px ;
}
. contentBody . color1 {
color : # a985e4 ;
}
. contentBody . color2 {
color : # 85abe4 ;
}
. contentBody . color3 {
color : # 85e4ad ;
}
. contentBody . color4 {
color : # d3e485 ;
}
. contentBody . color5 {
color : # e4a385 ;
}
. contentBody . color6 {
color : # e485b1 ;
}
. contentBody . contentWrapper {
position : relative ;
border-style : none none outset none ;
border-radius : 0px 0px 12px 0px ;
border-color : rgb ( 17 , 153 , 17 , . 3 ) ;
border-width : 3px ;
margin : 0px 4px 8px 4px ;
min-width : 98vw ;
z-index : 0 ;
}
. contentBody . contentWrapper : hover {
border-color : rgb ( 17 , 153 , 17 , . 8 ) ;
}
. contentBody . contentWrapper h1 {
display : inline-block ;
font-size : 2 . 1em ;
margin : 12px 4px 0px 4px ;
padding : 12px 32px 12px 32px ;
border-bottom-style : outset ;
border-radius : 32px 32px 0px 0px ;
color : # AA77FF ;
background-color : rgba ( 255 , 255 , 255 , . 06 ) ;
z-index : 0 ;
}
. contentBody . contentWrapper . content {
display : inline-block ;
min-width : 97vw ;
font-size : 1 . 15em ;
line-height : 1 . 4 ;
padding : 4px ;
margin : 0px 4px 0px 4px ;
background-color : rgba ( 255 , 255 , 255 , . 06 ) ;
z-index : 0 ;
max-height : 120px ;
overflow : hidden ;
}
. contentBody . contentWrapper . expandedContent {
display : inline-block ;
min-width : 97vw ;
font-size : 1 . 15em ;
line-height : 1 . 4 ;
padding : 4px ;
margin : 0px 4px 0px 4px ;
background-color : rgba ( 255 , 255 , 255 , . 06 ) ;
z-index : 0 ;
}
. contentBody . contentWrapper figure {
border : 2px ridge rgb ( 88 , 35 , 86 ) ;
border-radius : 4px ;
margin : 12px 20px 12px 20px ;
}
. contentBody . contentWrapper figcaption {
font-size : 0 . 85em ;
font-style : italic ;
color : rgb ( 221 , 105 , 217 ) ;
}
. contentBody . contentWrapper . datebar {
font-size : 0 . 75em ;
margin : 0px 4px 0px 4px ;
min-width : 98vw ;
min-height : 1px ;
z-index : 0 ;
background : linear-gradient ( 90deg , rgba ( 255 , 255 , 255 , . 06 ) 0 % , rgba ( 255 , 255 , 255 , . 3 ) 20 % , rgba ( 255 , 255 , 255 , . 06 ) 45 % , rgba ( 255 , 255 , 255 , . 06 ) 0 % ) ;
}
. contentBody . contentWrapper . date {
font-size : 0 . 75em ;
margin : 0px 4px 0px 4px ;
padding : 2px 0px 0px 2px ;
min-width : 98vw ;
z-index : 0 ;
background-color : rgba ( 255 , 255 , 255 , . 06 ) ;
}
. contentBody . contentWrapper . unexpanded {
position : absolute ;
bottom : 0px ;
min-width : 98vw ;
text-align : center ;
font-size : 1 . 75em ;
background : linear-gradient ( 180deg , rgba ( 255 , 255 , 255 , 0 ) 0 % , rgba ( 255 , 255 , 255 , 0 ) 5 % , rgba ( 32 , 32 , 32 , 1 . 0 ) 100 % ) ;
user-select : none ;
}
. contentBody . contentWrapper . unexpanded : hover {
bottom : -8px ;
background : linear-gradient ( 180deg , rgba ( 255 , 255 , 255 , 0 ) 0 % , rgba ( 255 , 255 , 255 , 0 ) 5 % , rgba ( 64 , 64 , 64 , 1 . 0 ) 100 % ) ;
cursor : pointer ;
}
. contentBody . filelisting {
padding : 12px 4px 2px 4px ;
font-size : 1 . 75em ;
}
. contentBody . folderlisting {
padding : 12px 4px 2px 4px ;
font-size : 1 . 75em ;
}
. contentBody . icon : link {
text-decoration : none ;
}
. contentBody . icon : visited {
text-decoration : none ;
}
. contentBody . icon : hover {
text-decoration : none ;
}
pre {
font-family : 'Courier New' , Courier , monospace ;
display : inline-block ;
padding : 3px ;
margin-left : 20px ;
font-size : 0 . 85em ;
position : relative ;
width : 85vw ;
max-height : 480px ;
overflow : scroll ;
inline-size : 85vw ;
color : darkseagreen ;
background : radial-gradient ( farthest-side at 90 % 90 % , rgba ( 0 , 255 , 0 , . 06 ) 0 % , rgba ( 255 , 255 , 255 , . 06 ) 100 % ) ;
}
/* width */
:: -webkit-scrollbar {
width : 8px ;
height : 8px ;
float : right ;
}
:: -webkit-scrollbar : hover {
width : 16px ;
height : 16px ;
}
/* Track */
:: -webkit-scrollbar-track {
background : rgba ( 0 , 0 , 0 , 0 ) ;
}
/* Handle */
:: -webkit-scrollbar-thumb {
background : rgb ( 161 , 46 , 161 ) ;
}
/* Handle on hover */
:: -webkit-scrollbar-thumb : hover {
background : rgb ( 197 , 34 , 189 ) ;
}
:: -webkit-scrollbar-corner {
background : rgba ( 0 , 0 , 0 , 0 ) ;
}
/* width */
pre :: -webkit-scrollbar {
width : 16px ;
height : 16px ;
}
pre . keyword {
color : cornflowerblue ;
}
pre . variable {
color : # AA77FF ;
}
pre . class {
color : rgb ( 216 , 107 , 74 ) ;
}
pre . function {
color : darkgoldenrod ;
}
pre . string {
color : forestgreen ;
}
pre . number {
color : # d8f070 ;
}
pre . comment {
color : # 6b235e ;
}
textarea {
font-family : 'Courier New' , Courier , monospace ;
display : inline-block ;
padding : 3px ;
margin-left : 20px ;
font-size : 0 . 85em ;
position : relative ;
inline-size : 85vw ;
color : darkseagreen ;
background : radial-gradient ( farthest-side at 90 % 90 % , rgba ( 0 , 255 , 0 , . 06 ) 0 % , rgba ( 255 , 255 , 255 , . 06 ) 100 % ) ;
border-radius : 8px ;
font-size : 1 . 4em ;
}
textarea : focus {
outline : none ! important ;
}
h1 {
font-size : 3 . 25em ;
}
. commentForm {
padding : 16px ;
line-height : 2 . 2 ;
vertical-align : text-top ;
}
. commentInfo {
padding-left : 24px ;
}
. commentDisplayer {
font-family : 'Courier New' , Courier , monospace ;
border : 1px solid rgb ( 36 , 163 , 36 ) ;
border-radius : 8px ;
margin : 16px ;
padding : 8px ;
line-height : 1 . 4 ;
}
input {
font-family : 'Courier New' , Courier , monospace ;
width : 240px ;
background-color : rgba ( 0 , 0 , 0 , 0 ) ;
border : 1px solid rgb ( 4 , 80 , 4 ) ;
color : lime ;
font-size : 1 . 4em ;
}
input : focus {
outline : none ! important ;
background-color : rgb ( 24 , 24 , 24 ) ;
border : 1px solid rgb ( 10 , 136 , 10 ) ;
}
option {
font-family : 'Courier New' , Courier , monospace ;
width : 240px ;
background-color : rgba ( 0 , 0 , 0 , 0 ) ;
border : 1px solid rgb ( 4 , 80 , 4 ) ;
color : lime ;
font-size : 1 . 4em ;
}
option : focus {
outline : none ! important ;
background-color : rgb ( 24 , 24 , 24 ) ;
border : 1px solid rgb ( 10 , 136 , 10 ) ;
}
select {
font-family : 'Courier New' , Courier , monospace ;
width : 240px ;
background-color : rgba ( 0 , 0 , 0 , 0 ) ;
border : 1px solid rgb ( 4 , 80 , 4 ) ;
color : lime ;
font-size : 1 . 4em ;
}
select : focus {
outline : none ! important ;
background-color : rgb ( 24 , 24 , 24 ) ;
border : 1px solid rgb ( 10 , 136 , 10 ) ;
}
button {
background-color : rgba ( 0 , 0 , 0 , 0 ) ;
border : 1px solid rgb ( 4 , 80 , 4 ) ;
font-size : 2em ;
margin-left : 24px ;
margin-top : 8px ;
color : lime ;
}
button : hover {
background-color : rgb ( 0 , 53 , 3 ) ;
border : 1px solid rgb ( 10 , 136 , 10 ) ;
}
button : disabled {
background-color : rgb ( 0 , 81 , 95 ) ;
}
select : disabled {
background-color : rgb ( 0 , 81 , 95 ) ;
}
input : disabled {
background-color : rgb ( 0 , 81 , 95 ) ;
}
textarea : disabled {
background-color : rgb ( 0 , 81 , 95 ) ;
}
. toolbar {
background-color : # 666666 ;
color : # 000000 ;
font-size : 0 . 75em ;
width : fit-content ;
margin-left : 36px ;
margin-top : 24px ;
}
. toolbarItem : hover {
background-color : # a1a1a1 ;
cursor : pointer ;
}
. contentWrapper . reallink {
font-size : 1 . 7em ;
text-decoration : none ;
color : white ;
}
. navbar {
font-size : 0 . 7em ;
color : lime ;
padding-top : 8px ;
padding-bottom : 8px ;
border-bottom : 1px solid darkgreen ;
position : fixed ;
top : 0px ;
z-index : 2 ;
width : 100 % ;
background : radial-gradient ( farthest-side at 90 % 90 % , rgba ( 0 , 64 , 0 , . 5 ) 0 % , rgba ( 64 , 0 , 64 , . 5 ) 100 % ) ;
}
. navbar : hover {
background : radial-gradient ( farthest-side at 90 % 90 % , rgba ( 0 , 64 , 0 , . 95 ) 0 % , rgba ( 64 , 0 , 64 , . 95 ) 100 % ) ;
}
. navbaritem {
padding-left : 16px ;
padding-right : 16px ;
display : inline-flex ;
text-decoration : underline ;
}
. navbaritem : first-of-type {
padding-left : 32px ;
}
. navbaritem : hover {
color : white ;
cursor : pointer ;
}
@ keyframes blink {
0 % { color : rgba ( 255 , 0 , 0 , 0 ) ; }
100 % { color : rgba ( 255 , 0 , 0 , 0.8 ) ; }
}
# liveindicator {
animation-name : blink ;
animation-duration : 3s ;
animation-iteration-count : infinite ;
animation-direction : alternate ;
text-decoration : none ;
padding-left : 8px ;
display : inline-flex ;
font-weight : 900 ;
}
. socials {
display : inline ;
float : right ;
}
. socials img {
width : 16px ;
padding-right : 16px ;
filter : invert ( 100 % ) ;
}
. socials img : hover {
cursor : pointer ;
}
. socials img : first-of-type {
padding-right : 32px ;
}