Template:VN.css

p{

 padding: 0;
 margin: 0;

}

.screen-box{

 aspect-ratio: 16/9;
 width:100%;
 border: 1px black solid;
 position: relative;

}

.layer{

 position:absolute;
 width: 100%;
 height: 100%;
 display: flex;

}

.layer-six {

 z-index: 6;

} .layer-four {

 z-index: 4;
 justify-content: center;
 align-items: center;
 flex-direction: column;

}

.layer-three {

 z-index: 3;

}

.layer-two {

 z-index: 2;

} /*.layer-two > pre, .layer-two > pre > a, .layer-two > pre > a > img {

 height: 100%;
 width: 100%;

}*/

img {

   width: 100%;
   object-fit: cover;

}

.layer-one {

 z-index: 1;

}

.back-button{

 width: 20%;
 height: 100%;

}

.forward-button{

 width: 80%;
 height: 100%;

}

1. mock-wrapper{

 width:70%;

}

.portraits{

 position:absolute;
 display:flex;
 justify-content: space-around;
 height:100%;
 width:100%;

}

.stage-left, .stage-right {

 width: 40%;

}

.flip > pre {

 transform: scaleX(-1);

} .stage-right > pre { }

.portrait > pre > a > img {

 height: 70%!important;

} /*.dialogue-container{

 background: white;
 padding: 20px;
 border-radius: 0 20px 20px 20px;

}*/ .dialogue{

 width: 93%;
 height: 23%;
 background:rgb(255, 230, 230);
 border-radius: 0 20px 20px 20px;
 box-shadow: 0 0 0 6px white, 0 0 0 9px red, 0 0 0 16px white;

} .spacer-top{

 height:70%;
 width:93%;
 display: flex;
 align-items: flex-end;

} .spacer-bottom{

 height:5%;

} .nameplate{

 display: flex;
 flex-direction: column;
 justify-content: center;
 padding: 0px 20px 0px 10px;
 width: fit-content;
 height: 5%;
 background: white;
 transform: translateY(-15px);
 border-radius: 0px 40px 0 0;
 box-shadow: 0 0 0 6px white, 0 0 0 9px red, -5px -5px 0 11px white, 4px -5px 0 11px white;
 z-index: 5;

} .nameplate > p{

 margin: 0!important;

} .dialogue-text{

 margin:10px!important;
 font-size: 1.5em;
 font-family:"Arial";
 color: white;
 text-shadow: -1px -1px black, -1px 1px black, 1px -1px black, 1px 1px black;

} pre{

 background-color: transparent!important;
 border: 0px!important;
 margin: 0px!important;
 padding: 0px!important;
 white-space: normal;

} .plaid {

 background-image:
   repeating-linear-gradient(0deg,
     rgba(255, 151, 244, 0),
     rgba(255, 151, 244, 0) 7%,
     rgba(255, 151, 244, 0.5) 7%,
     rgba(255, 151, 244, 0.5) 14%),
   repeating-linear-gradient(90deg,
     rgba(255, 151, 244, 0),
     rgba(255, 151, 244, 0) 1%,
     rgba(255, 151, 244, 0.5) 1%,
     rgba(255, 151, 244, 0.5) 2%);
 margin: 0;
 overflow: hidden;
 position: relative;

}