:root {
	--primary: #0068AD;
	--secondary: #F8A500;
	--dark: #033F62;
	--light: #F0F3F4;
	--white: #ffffff
}

body {
}

.dropdown-toggle,
.nav-link,
.btn {
	outline: none!important;
	box-shadow: none!important;
}

.form-control:focus {
	background-color: var(--white)!important;
}
.form-select {
	background-color: var(--white)!important;
}
.form-select-sm {
	padding-left: 0.75rem;
	border-radius: .5rem;
}

/* Header + Navigation */

.logo {
	width: 120px;
	height: auto
}

.navbar-toggler {
	border: 0
}

#main_nav ul a {
	/*padding-left: 3rem;
	padding-right: 3rem;
	/*color: var(--white);*/
	font-weight: 600;
}

#main_nav a.dropdown-item:before,
#main_nav a.dropdown-item:not(.active):hover:before  {
	content: none;
}

#main_nav .dropdown-menu {
	background-color: var(--dark);
	border-left: 0;
	border-right: 0;
	font-size: .9rem;
	margin: 0;
}
#main_nav a.dropdown-item {
	color: var(--bs-nav-link-color);
}
#main_nav a.dropdown-item:hover {
	color: var(--white);
	background-color: transparent;
}

.avatar {
	width: 50px;
	height: 50px;
	border-radius: 50%;
	background-color: var(--light);
	display: flex;
	align-items: center;
	justify-content: center;
}
.avatar-sm {
	width: 25px;
	height: 25px;
}
.avatar .initialia {
	font-size: 1.25rem;
	font-weight: 600;
}
.avatar img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.avatar-col {
	width: 25px;
	padding: .35rem 0!important;
}

#sub_nav {
	margin-bottom: 1rem;
}
#sub_nav ul > li:first-child a {
	padding-left: 0;
}

/* Typo */
h1, h2, h3, h4 {
	margin: 1rem 0;
}

/* Cards */
.card {
	box-shadow: 0 0 30px rgba(0,0,0,.05);
	border: 0;
	margin-bottom: 1rem
}
.card-footer {
	border-top: 0;
	background: transparent;
}

.card-header {
	background: transparent;
}

/* General */
section {
	margin-bottom: 3rem;
}

table tr.status_inactive > td {
	color: rgba(0,0,0,.25);
}
table tr.row_month_change > td {
	border-top: 2px solid #333
}

.table-muted td {
	background-color: #f8f9fa!important;
	color: rgba(0,0,0,.25)!important;
}

.password-strength-indicator {
	font-size: .8rem;
	color: #fff;
	margin-top: .25rem;
	padding: .125rem .5rem;
	border-radius: .5rem;
}
.password-strength-indicator.very-weak {
	background-color: #ca4242;
}
.password-strength-indicator.weak {
	background-color: #fd7e14;
}
.password-strength-indicator.mediocre {
	background-color: #d2c539;
}
.password-strength-indicator.strong {
	background-color: #198754;
}
.password-strength-indicator.very-strong {
	background-color: #76ff78;
}

/* ##################### */


/* Larger than MD */
@media (min-width: 768px) {

}


/* ##################### */


/* Larger than LG */
@media (min-width: 992px) {

}


/* ##################### */


/* Larger than XL */
@media (min-width: 1200px) {

	.logo {
		width: 175px;
		height: auto
	}

	#main_nav {
		width: 250px;
		height: 100vh;
		position: fixed;
		transition: all ease .2s;
		z-index: 100
	}

	#main_nav ul a {
		padding-left: 3rem;
		padding-right: 3rem;
	}

	#main_nav a.dropdown-item {
		padding-left: 1rem;
		padding-right: 1rem;
	}

	#content_wrapper {
		width: calc(100% - 250px);
		margin-left: 250px;
		transition: all ease .2s;
	}

	#content {
		margin: 0 auto;
	}
}


/* ##################### */


/* Larger than XXL */
@media (min-width: 1400px) {

	#main_nav {
		width: 300px;
	}

	#content_wrapper {
		width: calc(100% - 300px);
		margin-left: 300px;
	}
}

/* ##################### */


/* Small Height */
@media (min-width: 1200px) and (max-height: 700px) {

	#navbarToggleMain {
		/*overflow-y: auto;*/
	}
}

