. 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 : Garamond , 'Segoe UI' , Tahoma , Geneva , Verdana , sans-serif ;
background-color : $ SITE_BACKCOL ;
}
. contentBody {
backdrop-filter : blur ( 4px ) ;
color : # AA77FF ;
font-weight : 900 ;
text-shadow : 0 . 3px 0 . 3px 3px # 666666 ;
z-index : -1 ;
}
. contentBody . contentWrapper {
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 : hover : after {
display : inline-block ;
background-color : rgba ( 255 , 255 , 255 , . 06 ) ;
min-width : 98vw ;
text-align : center ;
font-size : 2 . 75em ;
content : "⤈ Click to expand." ;
border-color : rgb ( 17 , 153 , 17 , . 8 ) ;
}
. contentBody . contentWrapper h1 {
display : inline-block ;
font-size : 3 . 25em ;
margin : 12px 4px 0px 4px ;
padding : 12px 32px 0px 32px ;
border-bottom-style : outset ;
border-radius : 32px 32px 0px 0px ;
background-color : rgba ( 255 , 255 , 255 , . 06 ) ;
z-index : 0 ;
}
. contentBody . contentWrapper . content {
display : inline-block ;
min-width : 98vw ;
font-size : 1 . 25em ;
padding : 4px ;
margin : 0px 4px 0px 4px ;
background-color : rgba ( 255 , 255 , 255 , . 06 ) ;
z-index : 0 ;
}
. 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 ) ;
}