/*
// Small devices (landscape phones, 576px and up)
@media (min-width: 576px) { ... }

// Medium devices (tablets, 768px and up)
@media (min-width: 768px) { ... }

// Large devices (desktops, 992px and up)
@media (min-width: 992px) { ... }

// Extra large devices (large desktops, 1200px and up)
@media (min-width: 1200px) { ... }
*/

@media screen and (max-width: 768px) {
	.menu {
		display: flex;
		justify-content: space-between;
		padding-bottom: 0;
		height: 70px;
		align-items: center;
	}
	#chkToggle:checked + ul.main-nav {
		display: flex;
	}
	.main-nav {
		display: flex;
		margin-right: 30px;
		flex-direction: row;
		justify-content: flex-end;
	}
	.main-nav li {
		margin: 0;
	}
	.navbar-links {
		margin-right: 40px;
		color: var(--font-color);
	}
	.navbar .navbar-toggler {
		outline: 0;
	}
	.navbar .logo {
		margin-top: 0;
		/*      display: none;*/
	}
	.menu-toggle {
		display: none;
	}
	.logo:hover,
	.navbar-links:hover {
		color: var(--font-color);
	}
	.header-text h1 {
		font-size: 3rem;
	}
	.header-text h2 {
		font-size: 1.5rem;
	}
	.header-text button {
		margin-top: 10px;
	}
	.live-stream {
		width: 95% !important;
		max-width: 750px;
	}
}

@media all and (max-width: 1024px) {
	.live-stream {
		width: 107% !important;
		max-width: 750px;
	}
}

@media (max-width: 992px) {
	.navbar .logo {
		margin-top: 0;
		display: none;
	}
}

@media (max-width: 576px) {
	.container-title {
		font-size: 2.5rem;
		text-align: center;
		margin: auto;
	}
	.container-title:before {
		content: "";
		background-image: url(../images/icons/dots.svg);
		display: block;
		height: 37px;
		left: 60px;
		top: 25px;
		position: absolute;
		width: 37px;
	}
	.logo {
		font-size: 1.1rem;
	}
	.header-text h1 {
		font-size: 2rem;
		margin-bottom: 3px;
	}
	.header-text b {
		margin-bottom: 0px;
		font-family: serif;
	}
	.header-text button {
		margin-top: 6px;
		padding: 6px 20px;
	}
	.live-stream {
		width: 100%;
	}
}

@media screen and (max-width: 991px) {
	.navbar .navbar-collapse {
		height: 100vh;
		width: 100vw;
		background: var(--background);
		text-align: center;
		padding: 30px 0 10px 0;
		transition: 0.5s;
	}
	.navbar .nav-link {
		color: var(--font-color);
	}
	.navbar .navbar-nav .nav-link {
		color: var(--font-color);
		font-size: 23px;
		padding: 0;
	}
	.nav-scroll .navbar-collapse .nav-link {
		color: var(--font-color) !important;
	}
	.live-stream {
		width: 107% !important;
		max-width: 750px;
	}
}