.course-navigation {
	position: relative;
	display: flex;
	justify-content: left;
	align-items: left;
}

.nav-icon {
	width: 40px;
	background-color: white;
	color: black;
	border-radius: 50%;
	display: inline-block;
	justify-content: center;
	align-items: center;
	font-size: 20px;
	cursor: pointer;
	border: none;
	outline: none;
	box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
}

.prev-btn {
}

.next-btn {
	position:relative
}

@media ( max-width : 576px) {
	.prev-btn {
	}
	.next-btn {
	}
}

.nav-icon span {
	display: inline-block;
	font-weight: bold;
}

.nav-icon:hover {
	background-color: #FAF9F6;
}

.nav-tabs {
	padding-left: 0;
	margin-left: 0;
}

.nav-tabs .nav-link, .nav-tabs>li>a {
	font-size: 16px;
	font-weight: 500;
	color: #555;
	padding: 10px 15px;
	border: none;
}

.nav-tabs>li>a {
	transition: border-color 0.2s ease-in-out;
}

.nav-tabs>li.active>a, .nav-tabs>li.active>a:focus, .nav-tabs>li.active>a:hover
	{
	font-weight: bold;
	color: white;
	border-radius: 25px;
	background-color: #000000;
}

.nav-tabs>li>a:hover {
	color: black;
}

.nav-tabs {
	border-bottom: none;
}

.nav-item {
	display: inline-block;
}

.nav-tabs .nav-item .nav-link {
	border: none;
	box-shadow: none;
}

.nav-tabs>li>a {
	border: none;
}

.nav-icon-left, .nav-icon-right {
	width: 40px;
	height: 40px;
	background-color: white;
	color: black;
	border-radius: 50%;
	border: 1px solid #ccc;
	display: flex;
	justify-content: center;
	align-items: center;
	cursor: pointer;
	box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.1);
}

.nav-icon-left {
	position: absolute;
	left: 0;
}

.nav-icon-right {
	position: absolute;
	right: 0;
}

 @media ( max-width : 768px) {
   .nav-tabs {
		display: flex;
		overflow-x: auto;
		white-space: nowrap;
		-webkit-overflow-scrolling: touch;
	}
	.nav-tabs::-webkit-scrollbar {
		display: none;
	}
	.nav-item {
		flex-shrink: 0;
		margin-right: 5px;
	}
	.nav-tabs .nav-link {
		padding: 8px 12px;
	}
	.course-navigation {
		display: flex;
		overflow-x: auto;
		white-space: nowrap;
		-webkit-overflow-scrolling: touch;
	}
	.course-navigation::-webkit-scrollbar {
		display: none;
	}
	.course-card {
		flex-shrink: 0;
		margin-right: 10px;
		width: 80%;
	}
	.course-card {
		word-wrap: break-word;
		white-space: normal; 
	}
	.course-title-catalogue {
		overflow: hidden; 
		text-overflow: ellipsis; 
		display: -webkit-box;
		-webkit-line-clamp: 2; 
		-webkit-box-orient: vertical;
	}
}

.course-card {
	border: 1px solid #ddd;
	padding: 15px;
	border-radius: 5px;
	margin-bottom: 20px;
	margin-top: 20px;
	transition: box-shadow 0.2s;
	height: 370px;
	width: 270px;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	text-align: left;
	display: flex;
}

.course-card:hover {
	box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
}

.course-title-catalogue {
	font-size: 16px;
	font-weight: bold;
	/* 	white-space: nowrap; */
	/* 	overflow: hidden; */
	/* 	text-overflow: ellipsis; */
	margin-bottom: 5px;
	font-size: 1.608rem;
	font-weight: 600;
	line-height: 1.417;
	text-overflow: ellipsis;
	color: black;
	word-wrap: break-word !important;
	text-transform: capitalize;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
}

.course-title:hover {
	white-space: normal;
	overflow: visible;
	text-overflow: clip;
}

.instructor-name {
	font-size: 14px;
	color: #555;
}

.div-text-clamp-2{
	min-height: 40px; /* Ensures consistent height */
	line-height: 20px; /* Two lines of text */
	display: -webkit-box; /* Required for line clamping */
	-webkit-line-clamp: 2; /* Limit to 2 lines */
	-webkit-box-orient: vertical;
	overflow: hidden;
	text-overflow: ellipsis;
}

.instructor-name:hover {
	white-space: normal;
	overflow: hidden;
	text-overflow: clip;
}

.rating {
	color: #ffcc00;
	margin-bottom: 5px;
}

.price {
	font-size: 16px;
	font-weight: bold;
	margin-bottom: 5px;
}

.view-details {
	background-color: black;
	color: white;
	padding: 8px 15px;
	border-radius: 4px;
	font-weight: bold;
	text-decoration: none;
	display: inline-block;
	text-align: center;
	margin-top: 10px;
}

.view-details:hover {
	background-color: #333;
	color: white;
}

img.course-image {
	max-height: 120px;
	object-fit: cover;
	margin-bottom: 10px;
}

.carousel-control-prev-icon, .carousel-control-next-icon {
	background-color: #000;
	border-radius: 50%;
}

.course-card {
	position: relative;
}

.course-card:hover .course-tooltip {
	display: block;
}

.course-tooltip {
	display: none;
	position: absolute;
	top: 30%;
	left: 85%;
	background-color: #ffffff;
	color: #000000;
	padding: 10px;
	border-radius: 4px;
	box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.1);
	width: 250px;
	z-index: 999;
	border: 1px solid #ccc;
	transform: translateY(-50%);
}

.course-tooltip::before {
	content: '';
	position: absolute;
	top: 10%;
	left: -10px;
	transform: translateX(-50%);
	border-width: 10px;
	border-style: solid;
	border-color: transparent #fff transparent transparent;
	/* White arrow */
	z-index: 1000;
}

.course-tooltip::after {
	content: '';
	position: absolute;
	top: 50%;
	left: -12px;
	transform: translateY(-50%);
	border-width: 12
}

.margin-top {
    margin: 0;
    padding: 0;
}
.min-height-30{
	min-height:30px;
}

.course-card .course-image{
	height:120px;
}