/*----------------------------------------------------------*/
/* BODY */

.container-body {
	max-width: 1024px;
}

a {
	text-decoration: none;
}

.tooltip-icon {
	cursor: help;
}

/*----------------------------------------------------------*/
/* NAV */

.nav-link {
	margin: 5px 8px;
	padding: 3px 0px;
	border-bottom: 1px solid rgb(255, 255, 255, 0);
}

.nav-link:hover {
	border-bottom: 1px solid #0a58ca;
}

/*----------------------------------------------------------*/
/* Suggestions */

.suggest-int-link {
	padding-left: 0.75rem; /* 12px */
	padding-right: 0rem;
	color: rgb(33, 37, 41);
}

.suggest-number {
	color: #bbb;
}

.suggest-ext-link {
	padding: 0.5rem 0.625rem; /* 8px, 10px */
	text-decoration: none;
	color: #ddd;
}

.suggest-ext-link:hover {
	color: #495057;
	background-color: #f8f9fa;
}

.suggest-ext-link:active {
	background-color: #e9ecef;
}

/*----------------------------------------------------------*/
/* CHARTS & GRAPHS */

#graph {
	height: 780px;
}

.chart-container {
	position: relative;
	margin: auto;
	height: 100px;
	width: 100%;
}

/*----------------------------------------------------------*/
/* MOBILE - SEARCH BUTTONS */

@media (max-width: 400px) {
	/* Hide normal buttons */
	.search_buttons_normal {
		display: none;
	}
	/* Round search input */
	#search_input {
		border-radius: 4px;
	}
	/* Show mobile buttons */
	#search_buttons_mobile {
		display: flex !important;
	}
}

/*----------------------------------------------------------*/
/* MOBILE */

@media (max-width: 780px) {
	#graph {
		height: 750px;
	}
}

@media (max-width: 420px) {
	#graph {
		height: 560px;
	}
}

@media (max-width: 380px) {
	#graph {
		height: 490px;
	}
}

@media (max-width: 330px) {
	#graph {
		height: 410px;
	}
}