.border {
pointer-events: none;
z-index: 1001;
position: fixed;
top: 0px;
right: 0px;
width: 100%;
height: 100%;
box-sizing: border-box;
border: 35px solid black
}
.vignette {
position: fixed;
display: block;
top: 0;
left: 0;
width: 100%;
height: 100%;
box-shadow: inset 0px 0px 1000px 30px  black;
filter: opacity(100%);
pointer-events: none;
z-index: 1002;
}

body{
    background-image: url(images/grid.webp);
    background-position: center;
}

.container{
    width: 300px;
    height: 300px;
    background-color: rgba(255, 255, 255, 0.578);
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    box-shadow: 1px 1px 8px black; 

    margin: 200px auto;

}
.header{
    text-align: center;    
}
.content{
    color: white;
    width: 290px;
    height: 280px;
    background-color:rgba(0, 106, 255, 0.589);
    box-shadow: inset 3px 3px 7px rgba(0, 0, 0, 0.622);
}
.content p{
    padding: 10px;
    padding-top: 10px;
    overflow-y: scroll;
    max-height: 100px;
    font-size: 14px;
    font-weight: bold;
    font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
}
.role{
    font-size: 12px;
    font-weight: lighter;
}
.btns{
    display: flex;
    position: absolute;
    top: -10%;
    right: 0%;
}
button{
    background-color: rgba(255, 255, 255, 0.578);;
    border-radius: 0px;
    border: none;
    transition-duration: 210ms;
    font-size: 9px;
    height: 25px;
    width: 100px;
    letter-spacing: 3px;
}
button:hover{
    box-shadow: 0px -5px rgba(0, 106, 255);
    cursor:pointer;
}
.stamps{
    display: block;
    position: relative;
    bottom: 0%;
}
::-webkit-scrollbar {
  width: 5px;
  padding-right: 5px;
}

/* Track */
::-webkit-scrollbar-track { 
  background: rgba(0, 0, 0, 0.24);
}
 /* Handle */
::-webkit-scrollbar-thumb {
  background: rgba(0, 106, 255);
}