[QUOTE=BRIAN SELLA,Jan 10 2023, 10:43 AM][dohtml]

<link rel="preconnect" href="https://fonts.gstatic.com"> 
<link href="https://fonts.googleapis.com/css2?family=Faster+One&family=Poppins:wght@600;800&display=swap" rel="stylesheet">

<center>
  
  <div id="BMO">
      <div class="BMOscreen">
      
          <div class="BMOwarn">
          <h>WARNING</h><br><br>The unauthorized viewing of this film is stricktly prohibited under 25-15 of the Restricted Information Act.<br><br>Any misuse of the content herein will result in a maximum punishment.
          </div>
      
      
        <div class="BMOfinnbar">
            <div class="BMOficon">
            <img src="https://64.media.tumblr.com/79e8e0e113c9dd9e5d4b013b0af634d7/8a499c50d3840339-59/s400x600/28e77e758d6b3e7120e010f52b3616e3022395aa.gifv">
            </div>
            
              <div class="BMOfname">
              glinda
              </div>
        </div>
        
        <div class="BMOjakebar">
              <div class="BMOjname">
              <a href="">barbie</a>
              </div>
              
              <div class="BMOjicon">
            <img src="https://64.media.tumblr.com/82dc02b8c1c9123e6d2cba6391d4f949/1b1d1341ddc9ae8e-2f/s540x810/45fb7b6d56e63b65950d64a3a0aab261fa9aa12f.gifv">
            </div>
        </div>
        
        <div class="BMOvs">
        VS
        </div>
        
       <div class="BMOmsg"><div class="BMOmsg2">
         <div class="BMOmsgcon BMOmsgscroll">
         
             <div class="BMOfmsg">
             No! No smooching! Cut.
             </div>
             
             
             <div class="BMOjmsg">
              I thought it was great.
             </div>
             
             
              <div class="BMOfmsg">
             No, we can't use any of it.
             </div>
             
             
             <div class="BMOjmsg">
              I think we should use all of it.
             </div>
             
             <div class="BMOfmsg">
             No, not all. We should throw away the parts where Slime Princess was smoochin'. That was dumb.
             </div>
             
             <div class="BMOjmsg">
             What?
             </div>
             
             <div class="BMOfmsg">
             Duuuumb-ah.
             </div>
         
         </div>
       </div></div>
      </div>
      
      <div class="BMOline"></div>
      
      <div class="BMOcross1"></div>
      <div class="BMOcross2"></div>
      
      <div class="BMObttm" style="margin: 20px 0px 0px -160px;"></div>
      <div class="BMObttm" style="margin: -10px 0px 0px -80px;"></div>
      
      <div class="BMObcircle"></div>
      
      <div class="BMObtri"></div>
      
      <div class="BMOgcirc"></div>
      
      <div class="BMOrcirc"></div>
      
  </div>
  
</center>


<style>#BMO {
  width: 300px;
  height: 360px;
  border-radius: 25px;
  background-color: hotpink;
}

  .BMOscreen {
    width: 270px;
    height: 190px;
    border-radius: 15px;
    background-color: pink;
    position: relative;
    overflow: hidden;
    top: 14px;
    border: 1px solid #000;
  }
     .BMOwarn {
     width: 160px; height: 140px;
     padding-top: 40px;
     padding-right: 50px;
     padding-left: 50px;
     border: 5px solid #fff;
     color: #000;
     text-shadow: 0px 0px 4px hotpink;
     font-family: 'Poppins';
     font-size:8px;
     line-height: 11px;
     font-weight: 800; text-align: center;}  .BMOwarn h { font-size: 20px; letter-spacing: 2px; }
 
     .BMOfinnbar {
       transition: 0.7s ease-in-out 1s;
       position: relative;
       top: -190px;
       left: -400px;
       width: 0;
       height: 0;
       border-style: solid;
       border-width: 150px 370px 0 0;
       border-color: pink transparent transparent transparent;}
       #BMO:hover .BMOfinnbar { transition: 0.7s ease-in-out;
         left: 0px;
       }
       
       .BMOfname {
         width: 300px;
         font-family: 'Faster One';
         position: relative;
         font-size: 23px;
         top: -190px;
         left: 20px;
         color: rgba(0,0,0, 0.6);
         text-shadow: -1px 1px 3px #fff;
         transform: rotate(-23deg);
       }
       
       .BMOficon {
         width: 80px; height: 80px;
         overflow: hidden;
         position: relative;
         top: -140px;
         left: 10px;
         border-radius: 50px;
         border: 3px solid rgba(0, 0, 0, 0.2);
       } .BMOficon img { width: 80px; height: auto;}
       
       .BMOjakebar {
         transition: 0.7s ease-in-out 1s;
         position: relative;
         top: -300px;
         left: 300px;
         width: 0;
         height: 0;
         border-style: solid;
         border-width: 0 0 150px 370px;
         border-color: transparent transparent #e0d026 transparent;
       } #BMO:hover .BMOjakebar {
         left: -100px;
         transition: 0.7s ease-in-out;
       }
       
       .BMOjname {
         width: 300px;
         font-family: 'Faster One';
         position: relative;
         font-size: 23px;
         top: 80px;
         left: -335px;
         color: rgba(0,0,0, 0.6);
         text-shadow: -1px 1px 3px #fff;
         transform: rotate(-23deg);
       }
       .BMOjname a { text-decoration: none; font-style: italic; color: rgba(0,0,0, 0.8);transition: 0.7s ease-in-out; }
       .BMOjname a:hover { color: rgba(0,0,0,0.5);transition: 0.7s ease-in-out;}
       
       .BMOjicon {
         width: 80px; height: 80px;
         overflow: hidden;
         position: relative;
         top: 30px;
         left: -100px;
         border-radius: 50px;
         border: 3px solid rgba(0, 0, 0, 0.2);
       } .BMOjicon img { width: 80px; height: auto;}
  
    .BMOvs {
      background: transparent;
      color: rgba(0,0,0, 0.3);
      font-family: 'Poppins';
      font-size: 200px;
      font-weight: 800;
      text-shadow: 0px 0px 4px (0, 0, 0, 0.8);
      position: relative;
      top: -490px;
      opacity: 0;
      z-index: 3;
      transition: 0.7s ease-in-out 1s;
    }
    #BMO:hover .BMOvs {
      opacity: 1;
      top: -410px;
      transform: rotate(-22deg);
      font-size: 20px;
      transition: 0.7s ease-in-out;
    }
    
    
    .BMOmsg {
      background-color: rgba(0,0,0, 0.4);
      width: 260px; height: 180px;
      position: relative;
      top: -200px;
      transition: 0.7s ease-in-out;
      z-index: 4;
    }
    #BMO:hover .BMOmsg {
      top: -515px;
      transition: 0.7s ease-in-out 1s;
    }
    .BMOmsg2 {
      width: 240px; height: 160px;
      position: relative;top:10px;
      margin: 0;
      background-color: rgba(0,0,0,0.6);
    }
    
    .BMOmsgcon {
      width: auto; height: 150px;
      overflow: auto;
      margin: 5px;
    }
    
    .BMOmsgscroll::-webkit-scrollbar { width: 5px; }
    .BMOmsgscroll::-webkit-track { background-color: #666; }
    .BMOmsgscroll::-webkit-thumb { background-color: rgba(0,0,0,0.5); border: 1px solid #666;}
    
    .BMOfmsg {
      width: 130px;
      position: relative; left: -30px;
      text-align: left; padding: 5px;
      border-radius: 10px 10px 10px 0px;
      background-color: #16758d;
      border: 1px solid #6acfe8;
      color: #6acfe8;
      font-family: 'Poppins';
      font-weight: 600;
      font-size: 11px; line-height: 14px;
      margin: 5px;
    }
    
    .BMOjmsg {
      width: 130px;
      position: relative; left: 30px;
      text-align: right; padding: 5px;
      border-radius: 10px 10px 0px 10px;
      background-color: #7D7412;
      border: 1px solid #e0d026;
      color: #e0d026;
      font-family: 'Poppins';
      font-weight: 600;
      font-size: 11px; line-height: 14px;
      margin: 5px;
    }
  
  .BMOline {
    background-color: #666;
    margin: 30px 0px 0px -120px;
    width: 100px; height: 10px;
  }
  
  .BMOcross1 {
    background-color: #EACA3C;
    width: 50px; height: 20px;
    margin: 40px 0px 0px -140px;
  }
  .BMOcross2 {
    height: 50px; width: 20px;
    background-color: #EACA3C;
    margin: -35px 0px 0px -140px;
  }
  
  .BMObttm {
    border-radius: 5px;
    width: 25px; height: 10px;
    background-color: #666;
  }
  
  .BMObcircle {
    width: 15px; height: 15px;
    border-radius: 7px;
    background-color: #666;
    margin: -118px 0px 0px 200px;
  }
  
  .BMObtri {
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 0 17.5px 30.3px 17.5px;
    border-color: transparent transparent #2669BF transparent;
    margin-left: 120px;
  }
  
  .BMOgcirc {
    border-radius: 100%;
    width: 25px; height: 25px;
    background-color: #23C212;
    position: relative;
    left: 110px;
  }
  
  .BMOrcirc {
    border-radius: 100%;
    width: 50px; height: 50px;
    background-color: #B8141F;
    position: relative;
    left: 70px;
  }
  
  
</style>[/dohtml][/QUOTE]