@media (max-width: 135em) {
	.slider {
		height: 40rem !important;
	}
}
@media (max-width: 90em) {
	.slider {
		height: 35rem !important;
	}
}
@media (max-width: 106em) {
	html {
		font-size: 40%;
	}
}

@media (max-width: 70em) {
	html {
		font-size: 35%;
	}
	.slider {
		height: 30rem !important;
	}
}
@media (max-width: 58em) {
	html {
		font-size: 25%;
	}
	.header-logo {
		height: 10rem;
		width: 30rem;
	}
	.slider {
		height: 36rem !important;
	}
}

@media (max-width: 27em) {
	html {
		font-size: 26%;
	}
	.header-container {
		padding-top: 4rem;
		padding-bottom: 4rem;
	}
	.btn {
		font-size: 2.6rem !important;
	}
	.divider {
		transform: rotate(90deg);
	}
	.header-logo {
		filter: none;
		opacity: 100%;
	}

	.modal {
		grid-template-columns: 1fr 1fr;
	}
	.container-mobile {
		display: grid;
		grid-template-columns: 1fr 1fr;
		row-gap: 10rem;
	}
	.footer-logo {
		height: 4.6rem;
	}

	.host-section .games {
		grid-template-columns: repeat(3, 1fr);
		justify-items: center;
	}
	.games {
		row-gap: 3rem;
		padding-bottom: 10rem;
	}
	.custom1 {
		grid-column: 1/3;
		margin: 0 15rem 0 9.5rem;
	}
	.custom2 {
		margin: 0 13rem 0 -13rem;
	}
	.footer-container {
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		gap: 5.4rem;
	}
	.footer-items {
		grid-template-columns: auto;
		gap: 4rem;
	}
	.slider {
		height: 380px !important;
	}

	.slide {
		height: 380px !important;
	}
	.slider--1 {
		background-image: url("./pngs/AimDuos\ MobileCarousel.png") !important;
	}
	.slider--2 {
		background-image: url("./pngs/General\ banner\ mobile.png") !important;
	}
	.slider--3 {
		background-image: url("./pngs/425\ x\ 380\ Gamer\'sground.png") !important;
	}
	.slider__btn {
		display: none;
	}
	.btn {
		width: 94px;
		height: 100% !important;
		justify-self: end;
	}
	.container-host {
		max-width: 70rem;
	}

	.carousel {
		margin-bottom: 15rem;
	}
	/* .game-logo img {
    width: 40.2rem !important;
    height: 20rem !important;
  } */
	.heading-secondary {
		font-size: 3.2rem !important;
	}
	.reg--status {
		font-size: 1.8rem !important;
	}
	.carousel-section {
		margin-bottom: 10rem;
	}
	.modal-content-grid {
		width: 300px;
	}
}

@media (max-width: 24em) {
	.slider {
		height: 332px !important;
	}
}

@media (max-width: 20em) {
	.slider {
		height: 290px !important;
	}
}