@font-face {
  font-family: 'pixel'; 
  src: url(/fonts/LowresPixel-Regular.otf);
  font-weight: normal;
  font-style: normal;
  font-display: swap; 
}
header {
img {
    display: block;
    margin-left: auto;
    margin-right: auto;
    width:60%;
    margin-top: -14;
    height:auto;
    max-width:100%
}
font-family: Arial, Helvetica, sans-serif;
font-weight: bold;
}
.headerimage:hover {
    transform: rotate(0.5deg);
}
@media (max-width: 768px) {
.headerimage  {
    width: 100vw;
  }
}
.to-home{
    position:relative;
}
body {
background-image: url(images/background5.png);
background-repeat:repeat-y;
background-size: auto;
}
.to-home img {
    width: 450px;
     border-image:  url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAFQAAABUCAYAAAAcaxDBAAAC6ElEQVR4AeycS04DMRBETY7JCdhwGjacgGtCLIFkP4uuabUD+RSKlan0z37j9CTRiNPHy9vnONo//41z6ceXnk6vMY5svTG2H5+yCewfEzDQmE/aaqBpZHHA6fn99WkcvQ9EI06338q5VCtU8zF+ZNePvUOrZwjxBgogVWmgVYKIX4D2PjAO+Df2EGr6K834sXY/Zjz9aaemf885DvpTM5526gUoHaxzBAw0x0t6G6hElHOQQMd+049ba1OF/to42HOUHmP78ZT8LPpr0ajmP5eYHsw3Gc+Cczm/ND0k0MnbQhIwUIko52CgOV7Se/k9lD2EWmVkj1Fa5VP2av5qPOfnHUoiRW2gRYAMN1ASKerl91Dm291jmP/aNK8ZXL+ar3eoIpS0G2gSmHI3UEUoaV+AsmewpyTz/7g/zPMC9GFWfqGFGuhmsAb610DdU3PEvUNzvKS3gUpEOQcDzfGS3gYKRNVrhoECaFUaaJUg4g0UQKpSAuV3efaY6gSC+Kswcb3kQS2BXsWqbmgSBrr5ZBnopYGyJ2yud3PpFA/2WO/QzafYQA10M4HN6ZZ7m5ifPYL2R9OKh9/ym3eEgRroZgKb0y33NrFHqM9hm+dTTVeO53rJQxXwW14RStoNNAlMuRuoIpS0S6DsIewxyXp37y6B3j2BzQs0UAPdTGBzOu9QAK1eMwwUQKvSQKsEEW+gAFKVBtpayDDbUw00xJk3GmieWRhhoCGevFEC5Xd39pR8yeuO4HqpOXvaJVAmsI4JGGjMJ2010DSyOCANlD2DOi7Xtv/vPNbjfJRmPDWvGUqngbKg9UzAQGceZWWgZYRzggUoe87s3hp7CO3UzMd4avpTV/Oreir/t/3XpwXor542HCJgoIcwHXcy0OOsDnlKoOw5Kit7XjZe+Vfzc/6sR01/1qddAmWAdUzAQGM+aauBppHFAcs99qqHxOnyn1P/Op+qRzt5ULOneoeSYFEbaBEgww2URIr6CwAA///JGQSuAAAABklEQVQDACQoytbxyQx6AAAAAElFTkSuQmCC") 28 /  28px / 0 round;
    border-width:  28px;
    border-style:  solid;
}
@media (max-width: 768px) {
.to-home img{
    width:70vw;
    height:auto;
}
}
#houseon {
    display:none;
}
.to-home:hover #houseon{
    display:block;
}
.to-home:hover #houseoff{
    display:none;
}
div.housegraphic {
    display: flex;
    justify-content: center;
    align-content: center;
    align-items: center;
    margin-top: -10px;
}
@keyframes fadeIn {
  0% { opacity: 0; }
  100% { opacity: 1; }
}

.to-home {
  animation-name: fadeIn;
  animation-duration: 0.2s; /* Adjust the duration as needed (e.g., 1.5s) */
  animation-iteration-count: 1;
  animation-fill-mode: forwards; /* Ensures the element stays visible after the animation */
}
.headerimage {
  animation-name: fadeIn;
  animation-duration: 0.2s; /* Adjust the duration as needed (e.g., 1.5s) */
  animation-iteration-count: 1;
  animation-fill-mode: forwards; /* Ensures the element stays visible after the animation */
}



.tooltiptext {
  visibility: hidden;
  width: 120px;
  background-color: rgb(147, 95, 143);
  color: #fffeff;
  font-family: 'pixel';
  font-size: 16px;
  text-align: center;
  border-radius: 6px;
  padding: 6px ;
  position: absolute;
  z-index: 1;
  top: 80px;
  left: 104%;
}

.tooltiptext::after {
  content: "";
  position: absolute;
  top: 50%;
  right: 100%;
  margin-top: -5px;
  border-width: 5px;
  border-style: solid;
  border-color: transparent rgb(147, 95, 143) transparent transparent;
}
.to-home:hover .tooltiptext {
  visibility: visible;
}