<style>


/* DEFAULTS */
:root {
  --font-family: vicmonolight;
  --font-size: 10px;
  --sidebar-border:1px solid #000000;
  --link-color:#8b002f;
  --bg-color:#bbb;
  --text-color:#111111;
  --sidebar-bg:#ffffff;
  --content-bg:transparent;
  --content-padding:0;
  --background-image: url("https://heck.computer/images/stardust.png"); 
  /* for bg image, above would be url('site.com/image.jpg'); */
}
/* DEFAULTS */

/* FONTS */
@font-face{
	font-family:'vicmonolightob';
	src:url(https://heck.computer/fonts/vicmonolightob.otf)
}
@font-face{
	font-family:'nzs';
	src:url(https://heck.computer/fonts/nzs.ttf)
}
@font-face{
	font-family:'vicmonolight';
	src:url(https://heck.computer/fonts/vicmonolight.otf)
}
@font-face{
	font-family:'vicmonolightit';
	src:url(https://heck.computer/fonts/vicmonolightit.otf)
}
@font-face{
	font-family:'maya';
	src:url(https://heck.computer/fonts/maya.ttf)
}
@font-face{
	font-family:'ncs';
	src:url(https://heck.computer/fonts/ncs.ttf)
}
@font-face{
	font-family:'cmunvi';
	src:url(https://heck.computer/fonts/cmunvi.woff)
}
@font-face{
	font-family:'fsmr';
	src:url(https://heck.computer/fonts/fsmr.ttf)
}
@font-face{
	font-family:'must';
	src:url(https://heck.computer/fonts/must.ttf)
}


body {
  cursor:url('https://heck.computer/images/aisha.cur'), auto;
  margin: 0;
  font-size: 10px;
  font-family: vicmonolight;
  line-height: 15px;
  font-weight: lighter;
  font-smooth: unset;
  letter-spacing: .5px;
    color: #666;
background-color: #eee;
  }


a{color:#888;text-decoration:none;position:relative;transition:.69s ease-in-out}
a:hover {color: #333; }

a[href^="http"]:not(.imgs a)::after, a[href^="https://"]:not(.imgs a,)::after {
  content:"\2924";
padding:0;
margin-left:2px;
display: inline-block;
font-style: normal;
font-weight:bold;
color:var(--dark);
font-family:'Apple Symbols';
}

* {
scrollbar-color: #666 transparent;
image-rendering:pixelated; 
font-smooth: unset;
}

::-moz-selection{
	text-shadow:-1.5px 0px 2.5px rgb(0,0,0,.75);
	color:rgb(0,0,0,.75);
    background-color: rgb(0,0,0,.0)
}
::selection{
	text-shadow:-1.5px 0px 2.5px rgb(0,0,0,.75);
	color:rgb(0,0,0,.75);
    background-color: rgb(0,0,0,.0)
}

body a[href^="http"]:where(:not([href*="heck.computer"]))::after {
    content:"\2924";
    opacity: 100%;
    font-size: 1em;
  }
.go a[href^="http"]:where(:not([href*="heck.computer"]))::after {
    content:" ";
    opacity: 0%!important;
    font-size: 0em!important;
  }

html:before {
  animation: grain 8s steps(10) infinite;
  background-image: url(https://heck.computer/images/texture.png);
  content: "";
  height: 300%;
  left: -50%;
  opacity:.04;
  position: fixed;
  top: -110%;
  width: 300%;
  pointer-events:none;
  filter: brightness(125%) contrast(150%);
}
@keyframes grain {
  0%, 100% { transform:translate(0, 0) }
  10% { transform:translate(-5%, -10%) }
  20% { transform:translate(-15%, 5%) }
  30% { transform:translate(7%, -25%) }
  40% { transform:translate(-5%, 25%) }
  50% { transform:translate(-15%, 10%) }
  60% { transform:translate(15%, 0%) }
  70% { transform:translate(0%, 15%) }
  80% { transform:translate(3%, 35%) }
  90% { transform:translate(-10%, 10%) }
}

/*Everything goes inside here.*/
.wrapper {
  width: 1000px;
  margin: 50px auto;
  }
  
.sidebar-img, .footer, .title, .links, .box, .contents {
  margin-top: 10px;
  }
  
.title, .links, .footer {
  text-align: center;
  }
  
/*Navigation links.*/
.links ul {
list-style-type: none;
padding: 10px;
margin: 0;
font-size: 18px;
font-family: vicmonolightit;
  }
.links ul a{
text-decoration: none;
  }
.links ul a:hover {
list-style-type: none;
color: #666;
padding: 0;
margin: 0;
font-size: 18px;
font-family: vicmonolightit;
text-decoration: none;
text-shadow: -2.5px 0px 2.5px rgb(0,0,0,.50);
  }
.links li {
  display: inline-block;
  }

h1{
        color:#333;
  font-size:64px;
    font-family: nzs;
    font-weight: 300;
    line-height: 48px;
    margin-bottom: 13px;
    margin-top: 0px;
    padding-left: 5px;
    	text-shadow:-1.25px -0.25px 2.5px rgb(0,0,0,0.37);
                -webkit-text-stroke: 1px rgb(255,255,255,.5);


  }

h2 {
    font-size:100px;
    color:#333;
    font-weight:normal;
    margin-top: 5px;
    margin-bottom: 5px;
    font-family: nzs;
    text-shadow:-1px -0.5px 3.5px rgb(0,0,0,1);
    -webkit-text-stroke: .5px rgb(255,255,255,1);
  }
h3 {
    color:#555555;
    font-size:24px;
    font-family: vicmonolightit;
    font-weight: 300;
    line-height: 48px;
    margin-bottom: 1px;
    margin-top: 0px;
    padding-left: 5px;
    text-shadow:-1.25px -0.25px 2.5px rgb(0,0,0,0.37);
}
h4 {
       color:#555555;
    font-size:32px;
    font-family: vicmonolightit;
    letter-spacing:  ;
    font-weight: 300;
    line-height: 28px;
    text-shadow:-1.25px -0.25px 2.5px rgb(0,0,0,0.37); 
}
h4 a:hover{
           color:#000000;
    font-size:32px;
    font-family: vicmonolightit;
    letter-spacing:  ;
    font-weight: 300;
    line-height: 28px;
    text-shadow:-2px -0.1px 2.5px rgb(0,0,0,0.75);
background-color: rgb(255,255,255,0);
}
h2:after {
 content: " ";
 display:inherit;
 line-height: normal;
    margin: 0px;
}

.links li:before {
content: " ⋅ ";
  }
  
.links li:after {
content: " ⋅ | ";
  }
  
.links .last:after {
content: " ⋅";
  }
  
.links li:before, .links li:after {
  letter-spacing: 0.1em;
  }
  
.box {
  border: 1px dashed #000000;
  padding: 1em 1em;
  background-color: transparent;
  }
  
.inner {
    border: 1px dotted black;
    padding: 0em 1em;
    background-color: #ffffff;
  }

.contents {
  border: 1px dashed #000000;
  padding: 1em 1em;
  background-color: transparent;
}
  
/*image overflow*/
.box img, .sidebar img, .contents img {
  max-width: 100%;
  height: auto;
  }
  
/*Wrapper for the sidebar.*/
.sidebar {
  width: 215px;
  float: right;
  }
  
/*Container for the sidebar image.*/
.sidebar-image {
  border: 1px dashed #000000;
  }
  
/*Remove extra padding line at the bottom of the image.*/
.sidebar-image img {
  display: block;
  }
  
/*This is where the title, navbar, and main content all go.*/
.main-wrapper {
  margin-right: 225px;
  }
  
/*Two columns by default. The "single-column" class can be added to make it one column.*/
.main {
  columns: 3;
  column-gap: 10px;
  }
  
/*Make sure boxes don't spread over multiple columns.*/
.main .box {
  display: inline-block;
  }
.main .contents {
  display: inline-block;
}
  
.single-column {
  columns: 1;
  }
.double-column {
  columns: 2;
  }
  
.footer {
  margin-bottom: 25px;
   width: 100%;
  }

#s-m-t-tooltip{
text-align:center;
margin: 0px 0px 0px 24px;
padding-left: 20px;
padding-right: 20px;
padding-bottom: 4px;
padding-top: 4px;
border:1px solid #999999;
color:#000000;
background-color:rgb(255,255,255,.93);
font-size: 10px;
height:auto;
overflow:visible;
text-shadow:1px 0px 3px rgb(0,0,0,.25);
}
   
   
#statuscafe {
  background: ;
  border:1px dashed #000000;
  text-align:center;
  box-sizing:border-box;
  margin:0px auto;
  padding:5px 25px;
  position:relative;
  width:100%;
  height:auto;
  font-size:10px;
}
#statuscafe-username, #statuscafe-username a{
  font-family:vicmonolight;
  font-size:10px;
  display:inline-block;
  text-decoration:none;
}
#nowlisteningdate, #listeninglabel {
font-family:vicmonolight;
font-size:10px;
display:inline;
text-decoration:none;
}
#statuscafe-content, #nowlistening {
display:block;
margin:auto;
font-family: vicmonolight;
font-size: 10px;
}
#listen {
  background: ;
  border:1px dashed #000000;
  text-align:center;
  box-sizing:border-box;
  margin:0px auto;
  padding:5px 50px;
  position:relative;
  height:auto;
  font-size:10px;
    width: auto;
}
 .np {
    width: auto;
    margin: auto;
   background-color: #ffffff;
     border: 1px dashed #000000;
} 

.tracki {
  margin: auto;
  text-align: center;
  width: 150px;
}

 img#trackart {
   width: 225px;
     height: 50px;
     object-fit: cover;
   margin: auto;
   text-align: center;
   padding: ;
}
img#between {
    width: 260px; 
    object-fit: none;
}

/**
 * ants 
 */
 
@keyframes ants { to { background-position: 100% 100% } }

.antsdiv {
	padding: 1em;
	border: 1px solid transparent;
	background: linear-gradient(white, white) padding-box,
repeating-linear-gradient(-45deg, black 0, black 25%, transparent 0, transparent 50%) 0 / .6em .6em;
	animation: ants 10s linear infinite;
	line-height: 11px;
    height: 50px!important;
    font-size: 9px;
}
.antsdivtwo {
padding: 1em;
border: 1px solid transparent;
background: linear-gradient(white, white) padding-box,
repeating-linear-gradient(-45deg, black 0, black 25%, transparent 0, transparent 50%) 0 / .6em .6em;
animation: ants 10s linear infinite;
max-width: 225px;
font-size: 9px;
height:125px;
overflow: auto;
line-height: 11px;
    letter-spacing: .5px;
}

@media(max-width:915px) {
  .wrapper {    
    width: 95%;
    }
    
  .main-wrapper {
    width: calc(100% - 225px);
    }
  }
  
@media (orientation: portrait), (max-width: 480px) {
  .wrapper {
    width: 100%;
    }
  
  .main-wrapper, .sidebar, .footer {
    margin: 0 auto;
    width: 90%;
    }
  
  .sidebar {
    float: none;
    display: block;
    }

  .sidebar-image {
    margin: 0 auto;
    width: 33%;
    margin-top:25px;
    }

  .sidebar .sidebar-image img {
    width: 100%;
    }
    
  .footer {
    margin-bottom: 25px;
    }
  
  }
    </style>