@import "https://unpkg.com/open-props";
@import "https://unpkg.com/open-props/normalize.min.css";

.scrollport {
  -webkit-mask-image: linear-gradient(to right, #000, #000, #000, #000);

  overflow-x: auto;
  overscroll-behavior-x: contain;

  display: flex;
  gap: 25px;
  align-items: start;
  padding: 25px;
  scrollbar-color: rgba(255, 35, 35, 0.489) rgba(255, 255, 255, 0.242);
  scrollbar-width:thin;
}

.scrollport > div {
  block-size: 400px;
  aspect-ratio: 2 / 3;
  background-color: rgba(255, 0, 0, 0);
  border-radius: var(--radius-3);
  box-shadow: var(--shadow-4);

}

.scrollport .top {
  -webkit-mask-image: linear-gradient(to right, #000, #000, #000, #000);

  overscroll-behavior-x: contain;

  display: flex;
  gap: 25px;
  align-items: start;
  padding: 25px;
  scrollbar-color: rgba(255, 35, 35, 0.489) rgba(255, 255, 255, 0.242);
  scrollbar-width:thin;
}

.scrollport .top > div {
  block-size: 400px;
  aspect-ratio: 3 / 2;
  background-color: rgba(255, 0, 0, 0);
  border-radius: var(--radius-3);
  box-shadow: var(--shadow-4);

}


img {
    border-radius: var(--radius-3);
    box-shadow: var(--shadow-4);
    block-size: 400px;
    aspect-ratio: 2 / 3;
    transition : ease-in-out 0.2s;
    
}

.top figure {
    block-size: 400px;
    margin-left: 200px;
}


img:hover {
-webkit-transform:scale(1.05); 
-moz-transform:scale(1.05); 
-ms-transform:scale(1.05); 
-o-transform:scale(1.05); 
transform:scale(1.05);
}

h1 {
    text-align: center;
    margin-bottom: 20px;
    padding-left: 660px;
    margin-top: 60px;
}

h2 {
  font-family: "Bevan", serif;
  font-weight: 400;
  font-style: normal;
  text-align: center;
  font-size: 290px;
  padding: 0px;
  block-size: 400px;
  aspect-ratio: 2 / 3;
 -webkit-text-stroke-width: 5px;
 -webkit-text-stroke-color: #ffffff;
  text-shadow: 0 0 5px #ff3535, 0 0 15px #ffffff, 0 0 20px #ffffff, 0 0 40px #ff8484, 0 0 60px #ff0000, 0 0 80px #ff3535, 0 0 98px #ff0000;
  text-shadow: rgba(255, 255, 255, 0.5) 10px 10px 10px -10px inset, rgb(255, 255, 255) 10px 10px 10px -10px inset;
  color: rgba(255, 0, 0, 0);
}

.bevan-regular {
  font-family: "Bevan", serif;
  font-weight: 400;
  font-style: normal;
}
