body{
    background-image: url('hearts.gif');
}

p{
  font-family: monospace;
  text-align: justify;
  line-height: 1.4em;
  }
    
div{
  border: 5px solid #ee2566;
  border-radius: 25px;
  background-color: #fbe9fe;
  }
  
  .UI{
    padding: 10px;
    margin-bottom:-10px
    }

.arrow-button {
  --t: 40%; /* control the tail part */
  --h: 40%; /* control the head part */
  
  width: 150px;
  background: #FFFFFF;
  clip-path: polygon(100% calc(50% - var(--t)/2),var(--h) calc(50% - var(--t)/2),var(--h) 0,0 50%,var(--h) 100%,var(--h) calc(50% + var(--t)/2),100% calc(50% + var(--t)/2));
}

.grid-item-2 {
    width: 300px;
    Height: 98%;
    border: 7px solid #ee2566;
    border-radius: 25px;
    grid-column: 3 / 4;
    grid-row: 1 / 4;
    max-height: 420.76px;
    }
    
  .grid-item-1 {
    grid-column: span 2;
    grid-row: span 1;
    }
    
  .grid-item-3 {
    padding: 0px 20px 0px 20px;
    font-size: 18px;
    grid-column: span 2;
    grid-row: span 3;
    height: 98%;
    }
    
  .grid-item-4 {
    grid-column: 1 / 3;
    grid-row: 4 / 5;
    height: 99%;
    width: 99%;
    }
    
  .grid-item-5 {
    grid-column: 3 / 4;
    grid-row: 4 / 5;
    margin-top: -25px;
    }
    
  ul{
    list-style-type: none;
    font-family: monospace;
    font-size: 20px;
    }
    
.kagomaindiv {
    display: grid;
    grid-template-columns: 1fr 1fr 314px;
    grid-template-rows: 91px 1fr 1fr 1fr;
    border:5px outset #ee2566;
    background-color: lightpink;
    padding: 20px;
    margin: 30px;
    border-radius: 25px; 
    border-style: solid;
    gap: 20px;
    align-items: start;
  }
  
  h1 {
    text-align: center;
    font-family: kinkee;
    margin: 0px;
    font-size: 55px;
    color: #ee2566;
    }
    
 .gallery {
   display: flex;
   flex-wrap: wrap;
   margin: 5px 30px 10px 30px;
   padding: 12px;
   background-color: lightpink;
   justify-content: space-between;
   row-gap: 7px;
   }
    
 .gallery > img {
   max-height: 150px;
   }
   
  .gallery > a > img {
   max-height: 150px;
    }