* {
	margin: 0;
	padding: 0;
	box-sizing: border-box;
	font-family: Arial, Helvetica, sans-serif;
}
.background {
	height: 100vh;
	width: 100vw;
	background: url('assets/images/background-img.png') no-repeat center center fixed;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
}
.bird {
	height: 100px;
	width: 130px;
	position: fixed;
	top: 40vh;
	left: 30vw;
	z-index: 100;
}
.pipe_sprite {
    position: fixed;
    top: 35vh;
    left: 100vw;
    height: 70vh;
    width: 6vw;
    background: linear-gradient(to bottom, #30c130 0%, #018d01 100%);
    border: 5px solid #017e01;
    border-radius: 0 0 10px 10px;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
}

.pipe_sprite::before, .pipe_sprite::after {
    content: '';
    position: absolute;
    left: -1vw;
    height: 5vh;
    width: 7vw;
    background: #30c130;
    border: 5px solid #017e01;
    border-radius: 10px 10px 0 0;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
}

.pipe_sprite::before {
    top: -5vh;
}

.pipe_sprite::after {
    bottom: -5vh;
    transform: rotate(180deg);
}

.message {
	position: absolute;
	z-index: 10;
	color: #fff;
	top: 50%;
	left: 50%;
	font-size: 2em;
	transform: translate(-50%, -50%);
	text-align: center;
}
.messageStyle{
	background: #28a745;
	padding: 2rem;
	border-radius: 3%;
	border: 0.125rem solid #1e7e34;
	box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;
}
.score {
    position: fixed;
    top: 1rem;  /* Relative positioning */
    left: 50%;
    transform: translateX(-50%);
    background-color: #28a745;  /* Green color */
    color: white;
    padding: 0.625rem 1.25rem;  /* Consistent padding */
    font-size: 1.5rem;  /* Font size in rem */
    border-radius: 0.5rem;
    border: 0.125rem solid #1e7e34;  /* Green border for consistency */
    box-shadow: 0 0.25rem 0.375rem rgba(0, 0, 0, 0.1);  /* Subtle shadow */
    z-index: 1000;
}
.score_title {
    font-weight: bold;
}
.score_val {
    font-size: 1.5rem;  /* Equivalent to 24px */
}
@media only screen and (max-width: 1080px) {
    .message{
		font-size: 3.125em;
		top: 50%;
		white-space: nowrap;
	}
	.score {
        font-size: 1.5em;
        padding: 0.625em 1.25em;
    }
	.bird{
		width: 120px;
		height: 90px;
	}
	.pipe_sprite{
		width: 14vw;
	}
}