body{

    -webkit-font-smoothing: antialiased;
    margin:0px;
    padding:0px;
    overflow-x: hidden;
    cursor:none;
}
@font-face {
  font-family: 'brue';
  src: url('fonts/beausite-font-family-1758858872-0/BeausiteClassicTrial-Regular-BF6424edc02738f.otf') format('opentype');
  font-weight: normal;
  font-style: bold;
}

*{
  font-family:system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
  cursor:none;

}

.dot{
  background-color: black;
  display:flex;
  justify-content: center;
  align-items: center;
  height:20px;
  width:20px;
  border-radius: 50%;
  z-index:1;
  display:none;
}


.notification{
  background-color:#121111;
  overflow: hidden;
  font-size: 20px;
  font-family:'brue' ;
  max-width:300px;
  color:white;
  font-weight:bold;
  padding:10px;
  z-index:20;
}

.dream-section{
  cursor:none;
}

.weather-img{
  background:url("weatherAssets/gummy-bears.jpg");
  height:100%;
  width:100%;
  rotate:270deg;
}
.home-button:hover{
  .lottie-cat{
    display:inline-block;
    margin:0;
    padding:0;
  }
}
.running{
  color:red;
  background-color:cyan;
}


.home-div{
  pointer-events:none;
}

#gallery{
  height:140vmax;
  width:140vmax;
  position:absolute;
  z-index:-1;
}
.tile{
  border-radius:1vmax;
  position:absolute;
  transition:transform 800ms ease;
}
.tile:hover{
  transform:  scale(1.1);
}

.tile:hover > img{
  opacity:1;
  transform: scale(1.01);

}
.tile > img{
  height:100%;
  width: 100%;
  object-fit: cover;
  border-radius: inherit;
  opacity:1;
  transition: opacity 800ms ease;
}


.tile:nth-child(1) {height: 20vmin; width: 30vmin; left: 3%; top: 10%; }
.tile:nth-child(2) {height: 20vmin; width: 30vmin; left: 42%; top: 12%; }
.tile:nth-child(3) {height: 30vmin; width: 20vmin; left: 12%; top: 34%;}
.tile:nth-child(4) {height: 25vmin; width: 30vmin; left: 45%; top: 48%; }
.tile:nth-child(5) {height: 25vmin; width: 30vmin; left: 8%; top: 70%; }
.tile:nth-child(6) {height: 25vmin; width: 30vmin; left: 88%; top: 18%; rotate: 270deg; }
.tile:nth-child(7) {height: 25vmin; width: 30vmin; left: 50%; top: 84%; }
.tile:nth-child(8) {height: 25vmin; width: 30vmin; left: 80%; top: 42%;}
.tile:nth-child(11) {height: 20vmin; width: 30vmin; left: 94%; top: 78%; }
.tile:nth-child(10) {height: 25vmin; width: 30vmin; left: 0%; top: 104%; }
.tile:nth-child(9) {height: 25vmin; width: 30vmin; left: 98%; top: 104%;}

.weather-pg:before{
  background-color: rgba(232, 110, 110, 0.3); /* semi-transparent */
  backdrop-filter: blur(10px) brightness(0.8);
  opacity:30%;
  backdrop-filter:inherit;
  position: absolute;
  border-radius:30px;
  overflow: hidden;
  pointer-events: none;
  width:50%;
  height:90%;
  content:"";
  z-index:1;
}

@media screen and (max-width: 480px) {
  .notification{
    font-size:12px;
    font-weight:bold;
    width:50vw;
    height:auto;
    line-height: 18px;
  }
}