body, html {
    margin: 0;
    padding: 0;
    width: 100%;
    height: 100%;
	overflow-x: hidden;
    /* Remove the overflow: hidden; line */
}

.background {
    width: 110%; /* slightly bigger than the viewport to allow for movement */
    height: 110%;
    background-image: url('stars.png');
    background-size: cover;
    background-repeat: no-repeat;
    position: absolute;
    top: -5%; /* start slightly outside the viewport */
    left: -5%;
    transition: transform 0.1s; /* smooth out the movement */
    z-index: -1;
}

.focal-point {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 5px;
    height: 5px;
    transform: translate(-50%, -50%);
    z-index: 1;
}

.image-container {
    width: 1000px;
    height: 145px;
    background-image: url('PolarisLogo.png');
    background-size: cover;
    background-repeat: no-repeat;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.site-wrapper {
    min-height: 100vh;
    overflow: hidden;
    position: relative;
}

.viewport-container {
    width: 100%;
    height: 100vh;
    overflow: hidden;
    position: relative;
}

.content-below {
    width: 100%;
    /* additional styles for the content */
    padding: 20px;
}

/* For Chrome, Safari, and newer versions of Opera */
body::-webkit-scrollbar {
    width: 0;  /* Hide the scrollbar */
}

/* For Internet Explorer and Edge */
body {
    -ms-overflow-style: none;  /* Hide scrollbar */
}

/* For Firefox */
body {
    scrollbar-width: none;  /* Hide scrollbar */
}

.arrow-down {
    width: 0;
    height: 0;
    border-left: 20px solid transparent;
    border-right: 20px solid transparent;
    border-top: 20px solid white;
    position: absolute;
    bottom: 20px; /* Adjust as needed */
    left: 50%;
    transform: translateX(-50%);
    cursor: pointer;
}

