*{font-family: quicksand;
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}
body{
    background-color: #f5f5f5;
}

.slider-arrow{
position:absolute;
top:50%;
transform:translateY(-50%);
width:48px;
height:48px;
background:white;
border-radius:9999px;
display:flex;
align-items:center;
justify-content:center;
box-shadow:0 10px 20px rgba(0,0,0,0.2);
cursor:pointer;
transition:0.3s;
z-index:10;
}

.slider-arrow:hover{
background:#1e3a8a;
color:white;
}

@keyframes topbarSlide {
  from {
    transform: translateY(-100%);
    opacity: 0;
  }
  to {
    transform: translateY(0);
    opacity: 1;
  }
}

.animate-topbar {
  animation: topbarSlide 0.8s ease forwards;
}