@import url("https://fonts.googleapis.com/css2?family=Dekko&display=swap");

body {
    background-image: linear-gradient(
        45deg,
        #f9b9c9 25%,
        #51adcf 25%,
        #51adcf 50%,
        #f9b9c9 50%,
        #f9b9c9 75%,
        #51adcf 75%,
        #51adcf 100%
    );
    background-size: 56.57px 56.57px;
}

.outercont {
    border: solid;
     border-image: url("https://file.garden/Zx3Clq1Z7kthf_V-/birdbrainedneocities/l-extra22-20-s512-extra22-20-1.webp")
        40 fill repeat !important;
    border-image-slice: 15% !important;
    border-image-repeat: round !important;
    border-width: 20px !important;
    margin: auto;
    background-image: url("https://file.garden/Zx3Clq1Z7kthf_V-/birdbrainedneocities/tumblr_517b61d902de6c34b0fab7fa8766e413_83a4b235_75%20(1).webp");
    padding: 10px;
    background-clip: padding-box;
    height: 900px;
    width: 800px;
    z-index: 2;
}

.container {
        background-color: white;
    border-style: solid;
    border-image: url("https://file.garden/Zx3Clq1Z7kthf_V-/birdbrainedneocities/6zi9t5%20(1)%20(1).webp") 40 fill
        repeat !important;
    border-image-slice: 22% !important;
    border-image-repeat: round !important;
    border-width: 12px !important;
    background-clip: padding-box;
    height: 875px;
    color: #2e6275;
    font-size: 1.6em;
    font-family: "Dekko";
    text-align: center;
    padding: 5px
}


.imgitem img {
      transition: all 0.3s ease-in-out;
}

.imgitem:hover img {
      transform: scale(1.05);
}

.imgitem {
    display: inline;
}

@keyframes example {
  from {opacity: 1.0;}
  to {opacity: 0.0;}
}

.backimg:hover {
    animation-name: example;
  animation-duration: 1s;
    animation-fill-mode: forwards;
}

.backimg {
  opacity: 1.0;
    position: fixed;
    bottom: 2%;
    right: 14%;
}