@font-face {
  font-family: jnr;
  src: url(jnrfont_n-webfont.woff2) format('woff2'), 
       url(jnrfont_n-webfont.woff) format('woff');
  font-weight: 500;
}

@font-face {
  font-family: anton;
  src: url(https://meters.neocities.org/anton-regular-webfont.woff2) format('woff2'), 
       url(https://meters.neocities.org/anton-regular-webfont.woff) format('woff');
  font-weight: 500;
}


h1, h2, h3 {
  font-weight: 500;
}


html, body {
  cursor: url("img/cursor.ico"), default; 
}

body {
    font-family: jnr, Verdana;
    background: #008282;
    overflow: hidden;
    margin: 0 0;
    padding: 0 0;
}

.icons-grid {
    position: absolute;
    top: 0;
    left: 0;

    padding-top: 5px;

    display: flex;
    flex-direction: column;

    z-index: 50;
}

.icons-grid .icon {
    
    width: 140px;
    height: 140px;
    
    display: flex;
    flex-direction: column;
    align-items: center;
    align-content: center;
}

.icons-grid .icon img {
    display: block;
    width: 80px;
    height: 80px;
}

.icons-grid .icon p {
    color: #fff;
    font-size: 16px;
    text-align: center;
    width: 100%;
}

.window {
    margin-top: 5px;
    position: absolute;

    z-index: 100;
    
    left: 50%;
    transform: translate(-50%, 0%);

    border: 5px solid;
    border-image: url("img/theme-winfops/window-frame.png") 5;
    border-image-repeat: repeat;
}

.window .window-row {

    height: calc(100vh - 90px);
    
}

.window-top {
    background: #000082;
    height: 40px;
    
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;

    overflow: hidden;
    white-space: nowrap;
    user-select: none;
}

.window-top img {
    width: 32px !important;
    height: 32px !important;
    margin: 0;
    margin-left: -10px;
    padding: 0;
}

.window-top p {
    color: #fff;
    font-size: 16px;
    margin: 0;
    margin-left: 6px;
    text-overflow: ellipsis;
    flex-grow: 1;
    
}

.window-top-nav {
    display: flex;
    flex-basis: auto;
    flex-direction: row;
    align-items: center;
    justify-content: center;
}

.window-top-nav .nav-btn {
    display: flex;
    width: 36px;
    height: 32px;
    margin-left: 1px;
    background: #c3c3c3;
    
    border: 5px solid;
    border-image: url("img/theme-winfops/bottom-button.png") 5;
    border-image-repeat: repeat;

    align-items: center;
    justify-content: center;

    font-size: 20px;
}

.window-bottom {
    
    border: 4px solid;
    border-image: url("img/theme-winfops/window-frame-inner.png") 4;
    border-image-repeat: repeat;

    /* background: #fff; */
    background: url(img/star-bg.png) #c4beb1;
    background-size: 230px;
    color: #935864;
    
    overflow-y: scroll;
    
    height: calc(100% - 40px);
}

.window-bottom a {
  color: #935864;
}

.window-bottom a:hover {
  color: #90364e; 
}

.window-bottom .border-fancy {
  border: 10px solid transparent;
  border-image: url(img/box-border.png) 20 repeat;
  background: #c4beb1;
}

.bottom-bar {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    display: flex;
    flex-direction: row;
    height: 62px;
    width: 100%;
    background: url("img/theme-winfops/bottom-bar.png") repeat-x;
    padding: 9px 4px 5px 4px;

    z-index: 80;
}

.bottom-bar .button {
    
    display: flex;
    flex-direction: row;

    height: 100%;
    width: 360px;
    
    color: #000;
    font-size: 20px;
    
    margin-right: 9px;

    /* background: url("img/bottom-button.png") repeat-x; */
    border: 5px solid;
    border-image: url("img/theme-winfops/bottom-button.png") 5;
    border-image-repeat: repeat;

    align-items: center;
}

.bottom-bar .button-inverse {
    /* background: url("img/bottom-button.png") repeat-x; */
    border: 5px solid;
    border-image: url("img/theme-winfops/task-frame.png") 5;
    border-image-repeat: repeat;
}

.bottom-bar .button-selected {
    background: url("img/theme-winfops/button-selected-bg.png");
}

.bottom-bar .spacing {
    flex-grow: 1;
    display: block;
}

.bottom-bar .tasks {
    width: auto;
    flex-basis: auto;
    justify-content: right;
}

.bottom-bar .tasks .time-now {
    padding-right: 4px;
    padding-left: 20px;
    font-size: 18px;
}
    

.bottom-bar .button img {
    margin-left: 5px;
    user-select: none;
    width: 38px;
    width: 38px;
}

.bottom-bar .button p {
    padding-left: 6px;
    user-select: none;
    margin: 0;
}

.bottom-bar .menu {
    width: 122px;
}

.wow-wordart {
  display: inline-block;
  margin-bottom: 1rem;
  font-size: var(--step-8);
  background: linear-gradient(
  90deg,
  #9c00ff,
  #ff0000,
  #ff8800,
  #ffff00,
  #02be02,
  #0000ff,
  #4f00ff,
  #9c00ff
);
  background-clip: text;
  -webkit-background-clip: text;
  color: transparent;
  font-family: anton;
  text-align: center;
  font-size: 52px;
}

.wow-wordart-skew {
  transform: skewY(-8deg) scaleY(1.3) scaleX(0.8); 
}

.wow-wordart-wrapper {
	filter: drop-shadow(2px 2px 0px rgba(130, 140, 251, 0.8));
}

.blog-entry {
    margin-bottom: 50px;
}

.absolute-bottom-right {
  position: absolute;
  bottom: 0;
  right: 0;
}

.blog img {
    max-width: 100%;
}

.spoiler {
  position: relative;
}

.spoiler img, .spoiler-click {
  position: absolute;
}

.spoiler-click {
  background: #ccc;
  display: flex;
  align-items: center;
  justify-content: center;
}

.bi {
    display: inline-block;
    vertical-align: -.125em;
    fill: currentcolor;
}

.socials .btn {
  --bs-btn-bg: #935864;
  --bs-btn-border-color: #935864;
  --bs-btn-hover-color: #935864;
  --bs-btn-hover-bg: #fff;
  --bs-btn-hover-border-color: #935864;
  color: #fff;
}

.socials .btn:hover {
    color: #935864;
}


.socials li {
    margin-bottom: 8px;
}