@font-face {
  font-family: Berkshire Swash;
  src: local("Berkshire Swash"),
       url("Fonts/Berkshire Swash.woff") format('woff'),
       url("Fonts/Berkshire Swash.woff") format('woff2'),
       url("Fonts/Berkshire Swash.ttf") format('truetype');
}
@font-face {
  font-family: Caveat Brush;
  src: local("Caveat Brush"),
       url("Fonts/Caveat Brush.woff") format('woff'),
       url("Fonts/Caveat Brush.woff") format('woff2'),
       url("Fonts/Caveat Brush.ttf") format('truetype');
}
@font-face {
  font-family: Covered By Your Grace;
  src: local("Covered By Your Grace"),
       url("Fonts/Covered By Your Grace.woff") format('woff'),
       url("Fonts/Covered By Your Grace.woff") format('woff2'),
       url("Fonts/Covered By Your Grace.ttf") format('truetype');
}
@font-face {
  font-family: Eater;
  src: local("Eater"),
       url("Fonts/Eater.woff") format('woff'),
       url("Fonts/Eater.woff") format('woff2'),
       url("Fonts/Eater.ttf") format('truetype');
}
@font-face {
  font-family: Gluten Thin;
  src: local("Gluten Thin"),
       url("Fonts/Gluten Thin.woff") format('woff'),
       url("Fonts/Gluten Thin.woff") format('woff2'),
       url("Fonts/Gluten Thin.ttf") format('truetype');
}
@font-face {
  font-family: Gochi Hand;
  src: local("Gochi Hand"),
       url("Fonts/Gochi Hand.woff") format('woff'),
       url("Fonts/Gochi Hand.woff") format('woff2'),
       url("Fonts/Gochi Hand.ttf") format('truetype');
}
@font-face {
  font-family: Julee;
  src: local("Julee"),
       url("Fonts/Julee.woff") format('woff'),
       url("Fonts/Julee.woff") format('woff2'),
       url("Fonts/Julee.ttf") format('truetype');
}
@font-face {
  font-family: Lacquer;
  src: local("Lacquer"),
       url("Fonts/Lacquer.woff") format('woff'),
       url("Fonts/Lacquer.woff") format('woff2'),
       url("Fonts/Lacquer.ttf") format('truetype');
}
@font-face {
  font-family: Nothing You Could Do;
  src: local("Nothing You Could Do"),
       url("Fonts/Nothing You Could Do.woff") format('woff'),
       url("Fonts/Nothing You Could Do.woff") format('woff2'),
       url("Fonts/Nothing You Could Do.ttf") format('truetype');
}
@font-face {
  font-family: Pacifico;
  src: local("Pacifico"),
       url("Fonts/Pacifico.woff") format('woff'),
       url("Fonts/Pacifico.woff") format('woff2'),
       url("Fonts/Pacifico.ttf") format('truetype');
}
@font-face {
  font-family: Permanent Marker;
  src: local("Permanent Marker"),
       url("Fonts/Permanent Marker.woff") format('woff'),
       url("Fonts/Permanent Marker.woff") format('woff2'),
       url("Fonts/Permanent Marker.ttf") format('truetype');
}
@font-face {
  font-family: Pinyon Script;
  src: local("Pinyon Script"),
       url("Fonts/Pinyon Script.woff") format('woff'),
       url("Fonts/Pinyon Script.woff") format('woff2'),
       url("Fonts/Pinyon Script.ttf") format('truetype');
}
@font-face {
  font-family: Science Gothic;
  src: local("Science Gothic"),
       url("Fonts/Science Gothic.woff") format('woff'),
       url("Fonts/Science Gothic.woff") format('woff2');
}

form{
 margin:0;padding:0;display:inline;
}

.video-container {
 filter: invert(100%);
 mix-blend-mode: difference;
 z-index: 3;
 position:relative;
 width:400px;
 height:225px;
 margin:0;
}

.video-container iframe {
 position:absolute;
 top:0;
 left:0;
 width:100%;
 height:100%;
 margin:0;
}

#backgroundVideo {
   width: 100vw;
   height: 100vh;
   object-fit: cover;
   position: fixed;
   left: 0;
   right: 0;
   top: 0;
   bottom: 0;
   z-index: -1;
}

.inverted {
  filter:invert(100%);
  mix-blend-mode:difference;
  z-index: 3;
}

.SongText {
 filter:invert(100%);
 mix-blend-mode:difference;
 z-index: 3;
 color:rgb(0,0,0);
 font-size:3.5vh;
 text-align:left;
 font-weight:bold;
 font-family:Covered By Your Grace,Arial,cursive;
}

.linkContainer{
 height:9vh;
 text-align:center;
}

.myLink {
 text-decoration: underline;
 mix-blend-mode: difference;
 color:rgb(50,50,50);
 font-size:8vh;
 text-align:center;
 font-weight:bold;
 font-family:Arial,cursive;
}

.hidden {
    display: none;
}