
body {
    margin: 0;           
    height: 100vh;          
    display: flex;               
    flex-direction: column;   
    justify-content: center;   
    align-items: center;      
    background-image: url('https://foollovers.com/mat/frill03/h01-bg-lace.gif');
    background-repeat: no-repeat;
    background-position: left center;
    background-size: contain; 
        background-repeat: repeat-y; 
     background-size: 5%;
    gap: 20px;           
      font-family: 'Willow', sans-serif;
}
		@font-face {
  font-family: 'Willow';
  src: url('willow.ttf') format('woff2'),
       url('willow.ttf') format('woff');
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: 'PIXELS';
  src: url('PIXELS.ttf') format('truetype'); 
  font-weight: normal;
  font-style: normal;
}
 h1 { 
  font-family: 'PIXELS', sans-serif;
}
.boxtop {
     width: 500px;
    height: 50px;
    background: white;
        margin: 0 auto;   
        text-align: center;
        position: relative;
        top: -5px;
}

.box1 {
    width: 500px;
    height: 400px;
    background: white;
    display: flex;
    position: relative;
  border: 9px solid transparent;
    border-image-source: url("https://scemoboy.carrd.co/assets/images/gallery09/7602b1c2.png?v=00ac4b53");
    border-image-slice: 8 fill;
    border-image-repeat: round;
     
 
}
.box1box{
     width: 470px;
    height: 370px;
    border: 3px solid pink;
    background: white;
    position: absolute;
       box-sizing: border-box;
       bottom:15px;
       right: 15px;
        display: flex;
         gap: 5px;
}

.box1b{
  width: 465px;
  height: 32px;
   border: 3px solid blue;
      position: absolute;
    bottom: 0;
    left: 0;
    box-sizing: border-box;
    
  

}
      .box1l{
  width: 155px;
  height: 90%;
  border: 3px solid blue;
      box-sizing: border-box;
      	padding-left:5px;
      	position: relative;
}
.lace img{
   width:150px;
  height: 25px;
  position: relative;
   left: -5px;
}

.box1c {
  width: 145px;
  height: 180px;
  border: 3px solid blue; 
  box-sizing: border-box;
  overflow: auto;
  position:absolute;
  bottom: 36px;
  left: 160px;
  	padding-left:5px;
}
.myface img{
  width:145px;
  height: 145px;
  position: relative;
  top: 0px;

}

.box1r {
  width: 155px; 
  height: 230px;
  border: 3px solid blue; 
  box-sizing: border-box;
  display: block; 
position:relative;
overflow: auto;
	padding-left:5px;
    
}
.musicbox{
  width:153px;
  height: 95px;
  border: 1px solid blue;
  bottom: 37px;
  right: 0px;
  position: absolute;
}
.boxbottom{
      width: 500px;
    height: 50px;
    background: white;
        text-align: center;
margin: 0px;
position: relative;
bottom: 5px;
}
.soramimi {
  position: fixed;
  width: 250px; 
  height: 250px; 
  bottom: 40px; 
  right: 0px; 
  z-index: 999;   
  pointer-events: auto; 
  cursor: pointer;
  transform: translateX(-90%); 
  background: url("https://postimg.cc") no-repeat center right;
  background-size: contain;
}
.soramimi::after {
  content: "please check out Kitschy's beautiful site <3"; 
  position: absolute;
  top: 40px;      
right: -200px;    
  background: white;
  padding: 6px 12px;
  border: 3px solid pink;
  color: #555;
  font-family: 'Willow', sans-serif;
  font-size: 14px;
  white-space: nowrap;
  display: none; 
  pointer-events: none;
}

.soramimi:hover::after {
  display: block; 
}

.soramimi:hover::after {
  display: block; 
}
