body {
			background-color: #222222;
			color: #fff;
			margin:0px;
			padding:0px;
			font-family: Garamond;
		}

		.nav-bar {
			background-color: #222222;
			padding-left: 1em;
			padding-right: 1em;
			padding-top: 0.2em;
			padding-bottom: 0.2em;
			text-align: center;
			display: flex;
			justify-content: space-between;
			position: sticky;
			top: 0;
			z-index: 2;
		}

		.nav-bar #logo{
			display: flex;
			align-items: center;
		}

		.nav-bar h2{
			margin:0px;
			padding-left:5px;
			color:orange;
			font-family: Verdana;
			text-shadow: 1px 1px 14px black;
			font-style: bold;
			font-size: 28px;
			
		}

		.nav-bar ul {
			list-style: none;
			margin: 10px;
			padding: 0;
			display: flex;
			justify-content: space-between;
			gap: 0px 12px;
		}

		.nav-bar li {
			margin-right: 20px;
			text-shadow: 1px 1px 1px #606060;
			box-shadow: 0px 0px 2px gray;
			border-radius: 15px;
			padding: 8px;
		}
		
		.nav-bar input{
			background-color: #222222;
			border: none;
			color: white;
			outline: none;
			font-size: 16px;
			
			
		}

		.nav-bar a {
			color:orange;
			text-decoration: none;
			font-family: Verdana;
			display: flex;
			align-items: center;
			gap: 0px 4px;
		}

		.hero-section {
			position: relative;
			height: 80vh;
			display: flex;
			justify-content: center;
			align-items: center;
			color: #fff;
		}

		.hero-section img {
			position: absolute;
			width: 100%;
			height: 100%;
			object-fit: cover;
			opacity: 0.7;
			z-index: -1;
		}

		.hero-section #heading{
			color: orange;
			text-shadow: 5px 5px 13px black;
			font-family: Garamond;
			opacity: 1;
			font-size: 48px;
			
		}

		.movies-section {
			font-family: Verdana;
			font-size: 13px;
			padding-top: 10px
		}
		.movies-slider {
			display: flex;
			overflow-x: auto;
			scroll-behavior: smooth;
			-webkit-overflow-scrolling: touch;
		}
		.slide-container{
			position: relative;
			padding-left: 4em;
			padding-right: 4em;
			padding-top: 3em;
		}
		.slide-container h2{
			margin-top: 0px;
			margin-bottom: 20px;
		}

		.movies-slider::-webkit-scrollbar {
			display: none;
		}
		
		.scroll-btn {
		position: absolute;
		top: 44%;
		width: 40px;
		height: 40px;
		background-color: rgba(0, 0, 0, 0.5);
		color: #fff;
		border: none;
		font-size: 28px;
		cursor: pointer;
		}

		.prev-btn {
			left: 8px;
			border-radius: 10px;
		}

		.next-btn {
			right: 8px;
			border-radius: 10px;
		}
		
		.movie-card {
			margin-right: 35px;
			width: 200px;
			text-align: center;
			font-family: Verdana;
			font-size: 13px;
			padding: 10px;
			background-color: #2b2c2e;
			border-radius: 20px;
			margin-bottom: 20px;
		}

		.movie-card img {
			width: 200px;
			height: 300px;
			object-fit: cover;
			border-radius: 10px;
		}

		.movie-card h3 {
			color: #ff9900; 
		}

		.movie-card p {
			color: #fff;
		}
		
		.genre-tag
		{
			box-shadow: 0px 0px 4px gray;
			border-radius: 15px;
			display: inline-block;
			padding: 6px;
			margin: 4px;
			font-size: 10px;
		}
		
		.movies-slider a{
			cursor: pointer;
		}