@charset "utf-8";
@font-face
{
font-family: "PoetsenOne-Regular";
src: local("PoetsenOne-Regular"), url("/por.ttf") format("TrueType") ;
}

a:link {
  text-shadow: 1px 1px 5px black;
  color: #75f6ff;
}
a:hover {
  text-shadow: 1px 1px 5px black;
  color: #fff;
}
a:active {
  text-shadow: 0px 0px 5px black;
  color: #ff0;
}
a:visited {
  text-shadow: 1px 1px 5px black;
  color: #65e6ef;
}

h1 {
    font-size: 20pt;
    margin-top: 4px;
    margin-bottom: 2px;
    color: #008;
    text-shadow: 1px 1px 8px white;
}

h2 {
    font-size: 32pt;
    margin-top: 4px;
    margin-bottom: 2px;
    color: #feb;
    text-shadow: 3px 3px 10px #f60;
}

video#vidp {
position: fixed; right: 0; bottom: 0;
min-width: 1vw; /*min-height: 1vh;*/
width: auto; height: auto; z-index: -100;
background: url(Testbild-tno.svg) no-repeat;
background-size: cover;
background-repeat: no-repeat;
}
body {
                text-align: center;
                color: #da6;
                font-family: 'PoetsenOne-Regular', cursive;
                font-size: 12pt;
                text-shadow: 1px 1px 5px black;
                margin-top: 5px;
                background-color: #556;
                background-image: linear-gradient(black, #137);
                background-size: cover;
    }
table {
                margin: 2px;
                padding: 0px;
                text-align: center;
                color: #da6;
                font-family: 'PoetsenOne-Regular', cursive;
                font-size: 10pt;
                background-color: rgba(0,0,0,0.2);
                border-color: #112;
                border: 2px solid #000;
                border-radius: 8px;
    }
tr {
                background-image: linear-gradient(#556, black);
    }
td {
                padding: 0px;
                background-image: linear-gradient(#779, black);
    }
  .video-container {
    /* width is set as 100% here. any width can be specified as per requirement */
    width: 80%;
    padding-top: 56.25%;
    height: 0px;
    position: relative;
    text-align: center;
    margin-left: auto;
    margin-right: auto;
}
.videoplay {
    /* width is set as 100% here. any width can be specified as per requirement */
    width: 98vw;
    /*height: auto;
    position: relative;
    text-align: center; */
    margin-left: auto;
    margin-right: auto;
}
.video_f {
                border: 1px solid #999;
                border-radius: 6px;
                width: 1vw;
                /*height: 100%;*/
                position: absolute;
                top: 0;
                left: 0;
                object-fit: fill;
    }
.video_p {
                border: 1px solid #999;
                border-radius: 6px;
                width: 160px;
    }


.box {
  display: grid;
  grid-template-columns:  1fr;
  grid-template-rows:  100px 1fr 30px;
  gap: 2px 0px;
}
.child0 { grid-area: 1 / 1 / 2 / 2; background-color: rgba(255,128,128,0.3);}
.child1 { 
	grid-area: 2 / 1 / 3 / 2; 
	background-color: rgba(128,128,128,0.2); 
    margin: 0 auto;
}
.child2 { grid-area: 3 / 1 / 4 / 2; background-color: rgba(128,128,128,0.1);}


.moviebox {
  display: flex;
  flex-wrap: wrap;
  margin: 0 auto;
}

.btn {
  box-sizing: border-box;
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  background-color: transparent;
  border: 2px solid #e74c3c;
  border-radius: 0.6em;
  color: #e74c3c;
  cursor: pointer;
  display: flex;
  align-self: center;
  font-size: 1rem;
  font-weight: 400;
  line-height: 1;
  margin: 20px;
  padding: 1.2em 2.8em;
  text-decoration: none;
  text-align: center;
  text-transform: uppercase;
  font-weight: 700;
}
.btn:hover, .btn:focus {
  color: #fff;
  outline: 0;
}

.but {
  border-color: #3498db;
  color: #fff;
  box-shadow: 0 0 40px 40px #3498db inset, 0 0 0 0 #3498db;
  transition: all 150ms ease-in-out;
}
.but:hover {
  box-shadow: 0 0 10px 0 #3498db inset, 0 0 10px 4px #3498db;
}

/*  border-color: $blue;
  color: #fff;
  box-shadow: 0 0 40px 40px $blue inset, 0 0 0 0 $blue;
  transition: all 150ms ease-in-out;
  &:hover {
    box-shadow: 0 0 10px 0 $blue inset, 0 0 10px 4px $blue;
  }
}
*/

.fileinfo {
  margin: 2px;
  padding: 0em;
  font-size: 6pt;
}

.xbtooltip {
  display: none;
  width: 400px;
  position: absolute;
  background-color: rgb(21, 20, 100,1);
  background-image: linear-gradient(rgb(153, 119, 119), black);
  color: #ece7c8;
 font-size: 1em;
 font-style: normal;
 border: 4px double rgb(255, 166, 0); 
}

