/********************** LAYOUT ***************************/
.wrapper {
	display: flex;
	height:100vh; /*for scrollbar*/
	overflow-y:scroll;
}

.left-column {
	width: 40%;
	padding: 20px;                
	overflow-y:scroll; /*for scrollbar*/
}

/* make scrollbar transparent */
::-webkit-scrollbar {
	width: 0px;
	background: transparent;
}

.box-shadow {
	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
	border-radius: 5px;
}

.right-column {
	width: 60%;
	padding: 20px;
}

.video-link {
	display: block;
	padding: 10px;
	margin-bottom: 10px;
}

iframe {
	width: 100%;
	height: 400px;
	border: none;
}

.notes {margin-top: 20px;}

.truncate-note {
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: normal;
	max-width: 500px;
	cursor: help;
}

.reorder-handle {
	cursor: move;
}

#khoa {
	position:fixed;
	bottom:35px;
	right:35px;
	z-index:99999;
}

/****************** HIỆU ỨNG ************************/    

.phatsang:hover {
	border-radius: 5px;
	animation: greenGlow 4s ease-in-out infinite;
}

.phatsang{
	transform-origin:center;
	will-change: transform, box-shadow, filter; /*báo trước cho trình duyệt chạy mượt*/
	animation: greenGlow 2.5s ease-in-out infinite;
}

/*✨kiểu thở của trái tim💓*/
@keyframes greenGlow{

	0%,100%{
		transform:scale(1);
		filter:brightness(1);
		box-shadow:
			0 0 4px #28a745,
			0 0 12px #28a745,
			0 0 120px rgba(102,255,153,.8);
	}

	50%{
		transform:scale(1.04);
		filter:brightness(1.35);
		box-shadow:
			0 0 8px  #28a745,
			0 0 25px #28a745,
			0 0 50px #66ff99,
			0 0 120px rgba(102,255,153,.8);
	}
}
	//navbar dòng 46x
	/* container của input phải relative */
.navbar-search-block {
	position: relative; /* cần để suggest absolute dựa vào đây */
}

/* suggest list nổi lên */
.navbar-suggest {
	position: absolute; /* bắt buộc để không đẩy chữ */
	top: 100%;           /* ngay dưới input */
	left: 0;
	width: 100%;
	background: #343a40;
	border-radius: 0 0 4px 4px;
	display: none;
	z-index: 1050;
}

/* mỗi item */
.navbar-suggest-item {
	padding: 6px 10px;
	color: #f8f9fa;
	cursor: pointer;
	font-size: 14px;
}

/* hover đẹp hơn */
.navbar-suggest-item:hover {
	background: #495057;
}