body {
    margin: 0px;
    padding: 0px;
    box-sizing: border-box; overflow-x: hidden; overflow-y: auto;
    font-family: Arial, Helvetica, sans-serif, Snell Roundhand, cursive;
    background-image: url('imgs/image0.jpg');
    background-color:
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-position: center; 
    background-size: 100vw 100vh;
    overflow: scroll;
    animation-name: example;
    animation-duration: 60s;
    animation-fill-mode: forwards;
}

/*@keyframes example {
  from {background-image: url('imgs/image0.jpg');}
  to {background-image: url('imgs/spykids.gif');}
}*/

.bgvid1 {
    position: fixed;
    overflow: hidden;
    width: 100vw;
    height: calc((9/16)*100vw);
    filter: blur(4px);
    z-index: -9999999980;
    zoom: 2;
    transform: scale(2.5);
}

p {
    font-size: 1.5rem;
    margin-block-start: 0.55em;
    margin-block-end: 0em;
}
#topbar {
    position: fixed;
    height: -8vw;
    min-height: 35px;
    width: calc(100vw);
    background: rgb(74,74,74);
    top: 0;
    background: linear-gradient(0deg, rgb(74 74 74 / 0%) 0%, rgb(0 0 0 / 0%) 50%, rgba(0,0,0,0.8) 100%);
    z-index: 99999999;
    border-bottom: 0.5px solid white;
    opacity: 0.8;

}

@font-face {
  font-family: brandnewroman;
  src: url(brand-new-roman-bw-webfont.woff);
}

#topbar p {
    margin-block-start: 0.3em;
    text-align: center;    
    letter-spacing: 1px;    
    margin-block-end: 0em;
    color: white;
    font-size:calc(13px + 0.2vw);

}

#dropshadow_overlay {
    width: 90vw;
    height: 80vh;
    margin-left: 3.5vw;
    margin-right: 0;
    margin-top: 100px; 
    position: fixed;
    padding: 0px; /*THISSSSSSSSSSSA*/
    padding-right: -10px;
    /*filter: blur(5px);*/
    mix-blend-mode: ;
}
#searchbar {
    position: fixed;
    z-index: 9999999999;
    display: flex;
    flex-direction: row;
    top: 95px;
    right: 3.5vw;
    opacity: 0.6;
}

input {
    height: 20px;
    width: 15vw;
    margin-right: 5px;
    opacity: 0.4;
}

#floating_line {
    border-bottom: 0.5px solid black;
    opacity: 0.5;
    position: fixed;
    float: left;
    height: 150px;
    width: 100vw; 
    top: 0;
    right: 0;
    left: 0;
    bottom: 0;
}

#floatingtitle {
    font-family: Snell Roundhand, cursive;
    position: fixed;
    color: rgba(119,119,119,1);
    text-shadow: 3px 2px black;
    font-size: 1.9em;
    top: 80px;
    right: 0;
    left: 01.2vw;
    bottom: 0;
    mix-blend-mode: soft-light;
}

#dropshadow_overlay a  {
  color: #04d600;
  text-decoration: none;
  position: relative;
  top: 30px;
}

#dropshadow_overlay p {
    color: rgba(119,119,119,1);
    text-decoration: none;
    position:relative;
    top: 110px;
    left: 45px;
  }

  .RL {
    font-size: 1.6rem;
    text-indent: -20px;
  }

#dropshadow_overlay a:hover  {
    text-decoration: underline;
  }

#dropshadow_overlay a::before {
    content: '\261E  ';
    position: relative;
    font-size: 1.5rem;
    top: 0px;↠☞
    text-decoration: none;

}

.credit {
    position: fixed;
    color: #04d600;
    bottom: 5px;
    right: 10px;
    font-size: 10px;
}

.about {
    font-size: 2rem;
    color: #04d600;
    font-style: italic;
    padding: 0;
    margin: 0;
    text-align: justify;
    word-wrap: break-word;
    word-break: break-all;
    /*-webkit-hyphens: auto;
    -ms-hyphens: auto;
    hyphens: auto;*/
}

a.link1:visited {
  color: #0000EE;
}

#dropshadow_overlay::before {
    pointer-events: none;
    box-shadow: 2px 2px 35px rgba(0, 0, 0, 0.596);
    border: 0.5px solid white;
    border-radius: 10px;
	mix-blend-mode: multiply;
    content: " ";
	position: absolute;
	top: 85px;
	right: 0.5vw;
	left: 1vw;
	bottom: 1vw;
    opacity: 0.5;
}


#mainscrollcontainer {
    position: absolute;
    width: calc(100vw - 16px);
}

.project_container {
    height: 100vh;
    mix-blend-mode: none;
}
.project_container img {
    width: 100vw; /* or any custom size */
    height: 100%; 
    object-fit: contain;
    right:  0px;
    mix-blend-mode: none;
}

#dropshadow_overlay::after {
    pointer-events: none;
    border: 0.5px solid white;
    border-radius: 10px;
    content: " ";
    position: absolute;
    top: 85px;
    right: 0.5vw;
    left: 1vw;
    bottom: 1vw;
    opacity: 0.3;
    background: #ffffff38;
    z-index: -99999999;
    mix-blend-mode: soft-light;
}

