.vhs-effect {
    position: relative;
    overflow: hidden;
     background: repeating-linear-gradient(
        to bottom,
        rgba(255, 255, 255, 1) 2px,
        rgba(255, 255, 255, 0.1) 1px,
        transparent 1px,
        transparent 4px
    );
    filter: contrast(150%) brightness(90%);
    animation: vhs 5s infinite linear, flicker 1s infinite;
}

.vhs-effect::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: repeating-linear-gradient(
        to bottom,
        rgba(255, 255, 255, 1) 2px,
        rgba(255, 255, 255, 0.1) 1px,
        transparent 1px,
        transparent 4px
    );
    pointer-events: none;
    z-index: 2;
}

@keyframes vhs {
    0%, 100% {
        filter: contrast(90%) brightness(100%) hue-rotate(0deg) saturate(100%);
    }
    50% {
        filter: contrast(130%) brightness(110%) hue-rotate(10deg) saturate(150%);
    }
}

@keyframes flicker {
    10%, 19.999%, 22%, 62.999%, 64%, 64.999%, 70% { opacity: 0.9; }
    20%, 21.999%, 63%, 63.999%, 65%, 69.999% { opacity: 0.8; }
    95%, 100% { opacity: 0.8; }
}

    .banding-container {
            width: 777px;
            height: auto;
            position: relative;
            overflow: hidden; 
            text-align: center;
            margin:auto;
            background:white;
  
        }

        .banding-container img {
            width: 777px;
            height: auto;
            display: block; 
            text-align: center;
            margin:auto;
        }

        .banding-container::after {
            content: "";
            position: absolute;
            top: 0;
            left: 0;
            right: 0;
            bottom: 0;
            background: repeating-linear-gradient(
                to bottom,
                rgba(255, 255, 255, 0.3) 0px,
                rgba(255, 255, 255, 0.3) 1px,
                transparent 2px,
                transparent 4px
            );
            pointer-events: none;
            z-index: 2; 
            
}






.header {
  text-align: center;
   position: relative;
  z-index : 100;
 
}



body {
  border: solid red 5px;
  margin: 0;
  background-color: hsl(0, 0%, 100%);
  color: hsl(0, 0%, 10%);
  line-height: 1.5;
  font-family:  "pxplus_ibm_ega9regular"
  
}



.split {
  height: 100%;
  width: 50%;
  position: fixed;
  z-index: 1;
  top: 0;
  overflow-x: hidden;
  padding-top: 20px;

}

@font-face {
    font-family: 'pxplus_ibm_ega9regular';
    src: url('/fonts/pxplus-webfont.woff') format('woff2'),
         url('/fonts/pxplus-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'pixeltimesnewroman';
    src: url('/fonts/pixeltimesnewroman.ttf') format('ttf'),
    font-weight: normal;
    font-style: normal;

}


.footer {
  color:black;
  background-color:lightgreen;
  padding-bottom:0.2em;
  padding-top:0.01em;
   font-family: 'pixeltimesnewroman';
  font-size: 0.6em;
  width:100%;
  position: fixed;
  z-index: 1;  
  bottom: 0;
  margin-left:-1em;
 
}

.footer license {font-size:0.95em; }

.wiredproj {  font-size:1em; margin-top:0.4em;
}


.left {
  left: 0;
  background-color: white;
  color:red;   
}

.left li { color:red;}


.jacie-container :hover {
  background-color:red;
  color:white;
}

.sammy-container :hover {
  background-color:white;
  color:black;
}


.right {
  right: 0;
  background-color: black;
  color:orange; 
}

a {
  text-decoration:none;
  color:inherit;
}


ul a:hover, .footer a:hover{
text-decoration:underline;
}

.splitv {
  height: 90%;
  width: 100%;
  position: fixed;
  z-index: 0;
  top: 50%;
  overflow-x: hidden;
  padding-top: 20px;
}

.bottom {
  top:70%;
  background-color: black;
  color:gold;
}

.centered {
  position: absolute;
  top: 45%;
  left: 50%;
  transform: translate(-50%, -50%);
  text-align: center;
}


.jacie {
  font-size:1.5em;
  border: 1px solid red;
  background-color:white;
padding-left:.3em;
padding-right:1.3em;
  padding-top: .3em;
    padding-bottom: .3em;
    font-style:italic;
  max-width:20em;
}

.center{
    width: 50%;
  margin: 0 auto;

}

h2 {
  color:black;
  font-weight:normal;
  text-transform:uppercase;
  font-size: 1em;
  padding-top:1.5em;  padding-bottom:0.01em;
}

h3 {
  color:red;
  font-weight:normal;
  font-size: 0.9em;
  padding-top:1.5em;  padding-bottom:0.01em;
  font-style: italics;
}

.right h2 { color:white; }
.right h3, .right .column {color:orange;}

.sammy {
  font-size:1.5em;
  border: 1px solid white;
    background-color:black;

  padding-top: .3em;
    padding-bottom: .3em;
font-style:italic;
  max-width:20em;

  }



.centered img {
  width: 150px;
  border-radius: 50%;
}
ul{list-style:none;   padding-top:0.01em;
}

li{  padding-bottom:.75em;
}
.two-column {
  display: flex; 
  color:red;
  text-align:left;
  width:100%;
  font-size:0.9em;
}
.column{
    flex: 50%;
        width:100%;
    margin-left:-1.25em;

}

@media screen and (max-width: 650px) {
}