b
{
  color:black;
}


.puppyCardHide {
opacity: 0;
filter: blur(5px);
transform: translateX(-100%);
transition: all 1.5s;

}

.puppyCardShow {
opacity: 1; 
filter: blur(0);
transform: translateX(0);
}

#studPage {
  background-image: url("img/test4.webp"); 
  transition: background-image .7s ease-in-out; 
} 



@media only screen and (min-width: 1024px)  {
  #studPage {
    
    background-size: 125%;
  
  }
}
 

#home {
    background-image: url("img/mobile_background.webp");
}

@media only screen and (min-width:768px) {
  #home {
    background-image: url("img/Gallery/gallery4.webp");
}
}


@media only screen and (min-width: 1280px) {
    #home {
        background-image: url("img/background.webp");
    }
    @supports (-webkit-touch-callout: none) {
  /* CSS specific to iOS devices */ 
  #home{
    background-attachment: scroll;
  }
}


@supports not (-webkit-touch-callout: none) {
  /* CSS for other than iOS devices */ 
  #home {
    background-attachment: fixed;
  }
}
}


.transition-h {

  transition: max-height 0.5s;

}

#timer {
  position: relative;
 
}
   
    
#timer::before {
  content: '';
  position: absolute;
  top: 0px;
  right: 0px;
  bottom: 0px;
  left: 0px;
  background-image: url("img/paws5.webp"); 
  background-size: cover ;
  background-position: bottom;
  opacity: .1;
}
 
#timer-content {
  position: relative;
  z-index: 10;
}  

#reminderForm {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.7); 
  z-index: 1000;
} 

#reminderForm form{
  background-color: #fff;
  padding: 4rem 2rem 1.5rem 2rem;
  border-radius: 3%;
  
}