:root {
  --red: #f44336;
  --yellow: #ffc107;
  --blue: #03a9f4;
  --green: #8bc34a;
}

#browser-content::-webkit-scrollbar {
	width: 8px;
	height: 6px;
}

#browser-content::-webkit-scrollbar-track {
	/*background-color: #E0E0E0;*/
	background-color: rgba(224,224,224,0.25);
}

#browser-content::-webkit-scrollbar-thumb {
	-webkit-border-radius: 2px;
	border-radius: 2px;
	background-color: #9e9e9e;
}

#browser-content::-webkit-scrollbar-thumb:hover {
	background: #0067b1;
}

#sidebarMenu{
	min-height: 100vh;
}

header {
	height: 56px;
}

.display-1{
	font-size: 2rem;
	font-weight: 400;
}

.display-2{
	font-size: 1.5rem;
}

.browser-dot{
	border-radius: 50%;
	height: 15px;
	width: 15px;
	display: block;
	float: right;
	margin: 4px 4px;
}

.green.browser-dot{
	background-color: var(--green);
}

.yellow.browser-dot{
	background-color: var(--yellow);
}

.red.browser-dot{
	background-color: var(--red);
}

.card-body {
	padding: 0px;
	max-height: 66vh;
	overflow-y: scroll;
	min-height: 25vh;
}

@keyframes fadeIn {
	from {
		opacity: 0;
	}

	to {
		opacity: 1;
	}
}

.fadeIn {
	animation-duration: 1s;
	animation-fill-mode: both;
	animation-name: fadeIn;
}

.hide{
	display: none;
}

.hoverable {
	-webkit-transition: -webkit-box-shadow .25s;
	transition: -webkit-box-shadow .25s;
	transition: box-shadow .25s;
	transition: box-shadow .25s, -webkit-box-shadow .25s;
}

.hoverable:hover {
	-webkit-box-shadow: 0 4px 9px 0 rgba(0, 0, 0, 0.2), 0 3px 10px 0 rgba(0, 0, 0, 0.19);
	box-shadow: 0 4px 9px 0 rgba(0, 0, 0, 0.2), 0 3px 10px 0 rgba(0, 0, 0, 0.19);
}

.divider {
	height: 1px;
	overflow: hidden;
	background-color: #e0e0e0;
}

.nav-link{
	color: var(--blue);
	padding: 0px 1rem;
}

.nav-link.inactive-elem{
	color: var(--red);
}