*{
  margin: 0;
  padding: 0;
}

/* Javascript animation */
.hidden{
  opacity: 0;
  transition: 1s;
}
.image_hide{
  filter: blur(5px);
  transform: translateY(22%);
  transition: 1s;
}
/* Senior and children swimming */
.delay{
  transform: translateY(22%);
}
.show{
  opacity: 1;
  filter: blur(0);
  transform: translateX(0);
}

html{
scroll-behavior: smooth;
}

/* Scroll to top button */
#scroll_btn{
border: 1px solid #fff;
outline: none;
cursor: pointer;
position: fixed;
bottom: 25px;
left: 25px;
padding: 10px;
border-radius: 50%;
background-color: #00bfff;
display: none;
z-index: 4;
}
#scroll_btn i{
color: #fff;
font-size: 35px;
}

/* Main Background Image */
.image_container{
  background-image: url('../pic/watershop.png');
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  background-attachment: fixed;
  height: 100vh;
}
.image_frame{
  height: inherit;
  /* background-color: rgba(30, 144, 255,0.2); */
  background-color: rgba(0, 191, 255,0.1);
}
/* IMAGE TEXT */
.image_text{
height: inherit;
display: flex;
justify-content: center;
align-items: center;
}
.image_text_text{
color: #fff;
text-align: center;
font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
}
.image_text_text h2{
font-weight: 350;
font-size: 65px;
margin: 0 0 4%;
letter-spacing: 3px;
}
.image_text_text a{
text-decoration: none;
color: #fff;
background-color: #008000dd;
color: #fff;
padding: 17px 40px;
border-radius: 30px;
}
.image_text_text span{
font-weight: bolder;
}


/* Shopping items */
.shop_container{}
.shop_frame{
  margin: 8% 3%;
}
.shop_frame h2{
  text-align: center;
  font-size: 55px;
  font-weight: 300;
  font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
  margin: 0 0 8%;
}
.shop_content{}
.item_container{
  display: flex;
  justify-content: center;
  margin: 0 0 3%;
}
.item_frame{
  display: flex;
}
.items{
  box-shadow: 0 0 5px silver;
  width: 45%;
  margin: 0 20px;
}
.image{
  height: 320px;
}
.image img{
  width: 100%;
  height: inherit;
}
.price{
  text-align: center;
  font-size: 25px;
  font-weight: bold;
  padding: 25px 0;
  border: 1px double dodgerblue;
}