:root {
	--main-bg-color: #263544;
	--content-color: #f2f7fb;
	--navbar-color: #252733;
	--sb-active-color: #1d2531;
	--sb-active-sub-color: #272f3a;
	--box-color: #fff;
	--modal-border: e5e5e5;
	--border-color: #f0f0f0;
	--box-border-alt: #d2d6de;
	--gray-color: #b7c0cd;
	--status-color: #b7c0cd;
	--white-ff-color: #fff;
	--note-header: f5f5f5;
	--white-f6-color: #f6f6f6;
	--active-color: #68b36b;
	--ocean-color: #42a5f5;
	--bg-transporent: rgba(0,0,0, .1);
	--border-radius: 5px;
	--label-danger: #f44336;
	--label-success: #4caf50;
	--label-info: #1565c0;
	--label-warning: #ff9800;
	--label-new: #5381ff;
	--main-black: #333;
	--main-gray: #37474f;
	--border-form: #d2d6de;
	--hr-color: #eee;
	--user-footer: #f9f9f9;
	--color-icon-alt: rgba(0, 0, 0, 0.15);
	--date-picker-color: #eee;
}
/*
* Dark theme 
*/
html[data-theme='night-mode-1'] {
	--content-color: #181f25;
	--box-color: #1d2531;
	--border-color: #242e3d;
	--main-gray: #dfe5e9;
	--border-form: #242e3d;
	--main-black: #f6f6f6;
	--hr-color: #242e3d;
	--user-footer: #1d2531;
	--box-border-alt: #242e3d;
	--date-picker-color: #272f3a;
	--status-color: #444;
	--note-header: #272f3a;
}
/*
* MAIN STYLE
*/
.close {
	font-size: 28px;
	opacity: 1;
	color: var(--main-black);
}
body {
	background: var(--content-color);
	color: var(--main-gray);
}
.box {
	border-color: var(--box-border-alt);
}
.box-footer {
	border-top-color: var(--box-border-alt);
	background: var(--box-color);
}
.dropdown-menu,
.list-group-item {
	background: var(--box-color);
	border-color: var(--box-border-alt);
}
.content-wrapper {
	margin-top: 50px;
	background: var(--content-color);
}
.sticky-header {
	position: fixed;
	width: 100%;
	box-shadow: rgb(43 43 43 / 20%) 0px 2px 4px 0px;
}
.color-box {
  position: relative;
}
.color-box .box-body-color {
  width: 20px;
  height: 34px;
  padding: 5px;
  position: absolute;
  top: 0;
  left: 15px;
  right: 0;
  bottom: 0;
  z-index: 2;
}
input[name='color_header'],
input[name='color_footer'] {
  padding-left: 30px;
}
#js-pm-push-menu {
	position: fixed;
}
#example1 .status_1 td,
#example2 .status_1 td {
	color: var(--status-color) !important;
}
.form-control {
	border-color: var(--border-form);
}
.box {
	border-top: none;
}
.small-box, 
.box, 
.alert, 
.btn, 
.modal-content, 
.box_tags, 
.box_date, 
#topBtn, 
#example1, 
select[aria-controls="example1"], 
input[aria-controls="example1"],
#example2, 
select[aria-controls="example2"], 
input[aria-controls="example2"],  
#select_category, 
.breadcrumb, 
.login-box {
	border-radius: var(--border-radius);
}
select[aria-controls="example1"], 
input[aria-controls="example1"], 
select[aria-controls="example2"], 
input[aria-controls="example2"],
.form-control[disabled], 
.form-control[readonly], 
fieldset[disabled], 
.form-control {
	background: var(--box-color);
	background-color: var(--box-color);
	color: var(--main-gray);
}
.small-box,
.box,
.tabs div[data-tab],
.label,
.modal-content {
	background: var(--box-color);
	-webkit-box-shadow: rgb(43 43 43 / 10%) 0px 0px 5px 0px, rgb(43 43 43 / 10%) 0px 11px 6px -7px;
    box-shadow: rgb(43 43 43 / 10%) 0px 0px 5px 0px, rgb(43 43 43 / 10%) 0px 11px 6px -7px;
}
.panel {
	background: var(--box-color);
}
.panel-default>.panel-heading,
.note-btn {
	background: var(--note-header);
	border-color: var(--border-form);
	color: var(--main-black);
}
.note-editing-area p {
	margin: 0;
}
.panel-title {
	color: var(--main-black);
}
#example1 th, #example1 td,
#example2 th, #example2 td {
	vertical-align: middle;
	color: var(--main-gray);
}
.animate_3,
.animate_3:hover {
	-webkit-transition: all .3s ease;
	-moz-transition: all .3s ease;
	-ms-transition: all .3s ease;
	transition: all .3s ease;
}
.animate_5,
.animate_5 {
	-webkit-transition: all .5s ease;
	-moz-transition: all .5s ease;
	-ms-transition: all .5s ease;
	transition: all .5s ease;
}
.drop-shadow {
	-webkit-box-shadow: 0 0 20px 0 rgb(0 0 0 / 20%);
    box-shadow: 0 0 20px 0 rgb(0 0 0 / 20%);
}
.tabs div[data-tab]:hover {
  cursor: pointer;
  background: var(--ocean-color);
  color: #fff;
  border-color: var(--ocean-color);
}
.tabs div.active-tabs[data-tab] {
  color: white;
  background: var(--main-bg-color);
  border: 1px solid var(--main-bg-color);
}
.tabs div[data-tab] {
  background: white;
  color: #2e3440;
  display: inline-block;
  border: 1px solid var(--box-color);
  border-bottom: none;
  margin: 0;
  padding: 5px 20px;
  border-radius: 5px 5px 0px 0px;
}
.tabs div.active-tabs:not([data-tab]) {
  display: block !important;
}
.tabs div.active-tabs:not([data-tab]) div {
  display: block;
}
.tabs div:not([data-tab]) {
  display: none;
}
hr {
	border: 1px solid var(--hr-color);
}
.main-footer {
	border: none;
	background: var(--navbar-color);
	color: var(--main-gray);
}
.table-bordered > thead > tr > th, 
.table-bordered > tbody > tr > th, 
.table-bordered > tfoot > tr > th, 
.table-bordered > thead > tr > td, 
.table-bordered > tbody > tr > td, 
.table-bordered > tfoot > tr > td,
.table-bordered,
.box-header.with-border {
	border-color: var(--border-color);
}
.brand-line h5,
.footer-brand h5,
.footer-logo-envy,
.logo-envy {
	display: inline-block;
	vertical-align: middle;
} 
.footer-logo-envy,
.logo-envy {
	width: 60px;
	height: 25px;
	background: url('../../../images/envy.png') center center/contain no-repeat;
}
.footer-hr {
	border: .5px solid var(--sb-active-color);
}
/*
* MAIN HEADER
*/
.main-header .logo {
	background: var(--navbar-color);
	color: var(--white-ff-color);
}

.main-header .sidebar-toggle,
.main-header .navbar .nav > li > a {
	color: var(--white-ff-color);
}

.main-header .navbar-static-top {
	background: var(--navbar-color);
}
html .skin-blue .sticky-header .navbar-static-top {
	background: var(--navbar-color) !important;
}
.main-header .navbar .nav .switch-mode {
	padding: 15px;
	background: transparent;
	color: var(--white-ff-color);
	border: none;
}
.main-header li.user-header {
	background: linear-gradient(var(--navbar-color), var(--main-bg-color));
}
.navbar-nav > .user-menu > .dropdown-menu, 
.navbar-nav > .user-menu > .dropdown-menu > .user-body {
	border-bottom-right-radius: var(--border-radius) ;
	border-bottom-left-radius: var(--border-radius);
}
.navbar-nav > .user-menu > .dropdown-menu > .user-footer {
	background: var(--user-footer);
}
.navbar-nav > .user-menu > .dropdown-menu > .user-footer {
	padding: 0;
}
.dropdown-menu > .user-footer > a {
	color: var(--main-black);
	padding: 1.2em 20px !important;
	height: auto;
}
.dropdown-menu > .user-footer > a:hover {
	background: #f1f1f1;
}
.navbar-custom-menu > .navbar-nav > li > .dropdown-box {
	background: none;
	position: absolute;
	top: 63px;
	right: 15px;
	-webkit-box-shadow: 0 0 20px 0 rgb(0 0 0 / 30%);
	box-shadow: 0 0 20px 0 rgb(0 0 0 / 30%);
	border: none;
}
.dropdown-box:before {
	content: "";
    border: 10px solid transparent;
    border-left-color: #252733;
    border-top-color: #252733;
    position: absolute;
    border-radius: 3px;
    top: -8px;
    right: 15px;
    -webkit-box-shadow: -5px -5px 12px -2px rgb(0 0 0 / 30%);
    box-shadow: -5px -5px 12px -2px rgb(0 0 0 / 30%);
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    z-index: 1002;
}
/*
* LOGIN PAGE
*/
.login-page {
	width: 100%;
	height: 100%;
	position: fixed;
	top: 0;
	left: 0;
	overflow: auto;
	background: var(--content-color);
} 
.login-box {
	width: 95%;
	max-width: 450px;
}
.login-form {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	z-index: 2;
}
.login-box-body {
	border-radius: 10px;
	padding: 90px 30px 60px;
}
.login-box-body h3,
.login-box-msg {
	color: var(--main-gray);
}
.login-box-body label {
	font-size: 16px;
}
.login-box-body .btn-nau-login {
	padding: 10px;
	font-weight: 700;
	border-width: 2px;
}
.login-box-body .btn-nau-login:hover {
	background: transparent;
	color: var(--main-black);
}
.login-box-body .brand-line {
	margin-top: 30px;
}
.login-box-body #username,
.login-box-body #password {
	height: 45px;
	margin-bottom: 25px;
	color: var(--main-black);
	font-weight: 700;
}
.login-box-body .has-feedback label ~ .form-control-feedback {
	top: 32.5px;
}
.login-box-image {
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	background: url("../../../images/thomas-kelley-JoH60FhTp50-unsplash.webp") center center/cover no-repeat;
	z-index: 1;
}
.login-box-image:before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	width: 100%;
	height: 100%;
	z-index: 2;
	background: linear-gradient(76deg,rgba(29, 37, 49, 1),transparent);
}
/*
* SIDEBAR 
*/
.open-on-load, .pm-menu-container {
	background: var(--main-bg-color);
}
.sidebar {
	display: flex;
	flex-direction: column;
	overflow-y: scroll;
	height: 90% !important;	
}
.sidebar-menu {
	overflow: visible;
}
.sidebar::-webkit-scrollbar {
	width: 7.5px;
}
.sidbar::-webkit-scrollbar-track{
	background: var(--main-bg-color);
	box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
}
.sidebar::-webkit-scrollbar-thumb {
	background: darkgray;
	border-radius: 10px;
}
.sidebar-collapse .sidebar {
	overflow-y: unset;
}
.sidebar-collapse .sidebar-menu > li:hover > a, 
.sidebar-menu > li.active > a, 
.sidebar-menu > li.menu-open > a {
	background: var(--sb-active-color);
}
.sidebar-menu > li.header {
	font-weight: 500;
	color: var(--white-ff-color);
}
.sidebar-menu li > a {
	color: var(--gray-color);
	border-left: 3px solid transparent;
}
.sidebar-menu > li > .treeview-menu {
	padding: 10px 0;
	background: var(--sb-active-sub-color);
	border-left: 3px solid transparent;
}
.sidebar-menu > li.active > a,
.sidebar-menu > li.active > .treeview-menu {
	border-left-color: var(--active-color);
}
.sidebar-menu .menu-open > a,
.sidebar-menu .menu-open .treeview-menu {
	border-left-color: var(--ocean-color);
}
.treeview-menu > li {
	position: relative;
}
.sidebar-menu .menu-open .treeview-menu .notification {
	padding: 5px 10px;
	font-size: 12px;
	background: var(--label-new);
	position: absolute;
	top: 7px;
	right: 30px;
}
.aside-footer {
	position: absolute;
	bottom: 0;
	padding: 12px 10px 6px 20px;
	color: #717171;
	display: block;
}
.sidebar-collapse .aside-footer {
	display: none;
}
/*
* BTN | LABEL
*/
.label {
	display: block;
	font-size: 100%;
	border-radius: var(--border-radius);
}
.btn-success:hover, 
.btn-success:active, 
.btn-success.hover {
	background: #357a38;
	border-color: #357a38;
}
.btn-danger:hover, 
.btn-danger:active, 
.btn-danger.hover {
	background: #aa2e25;
	border-color: #aa2e25;
}
.btn-info:hover, 
.btn-info:active, 
.btn-info.hover {
	background: #0e4686;
	border-color: #0e4686;
}
.btn-warning:hover, 
.btn-warning:active, 
.btn-warning.hover {
	background: #b28704;
	border-color: #b28704;
}
.label-new {
	background: var(--label-new);
}
.label-success,
.alert-success,
.btn-success {
	background: var(--label-success);
	border-color: var(--label-success);
}
.label-danger,
.alert-danger,
.btn-danger {
	background: var(--label-danger);
	border-color: var(--label-danger);
}
.btn-info,
.label-info,
.alert-info {
	background: var(--label-info);
	border-color: var(--label-info);

}
.btn-warning,
.label-warning,
.alert-warning {
	background: var(--label-warning);
	border-color: var(--label-warning);
}
.btn-info i,
.btn-success i,
.btn-warning i,
.btn-danger i {
	text-shadow: 0 6px 8px rgb(62 57 107 / 18%);
}
/*
* MODAL|POPUP
*/
.modal-header {
	border-bottom: 1px solid var(--modal-border);
}
.modal-footer {
	border-top: 1px solid var(--modal-border);
}
.modal-body .modal-drag-zone {
	padding: 50px;
	background: var(--white-f6-color);
	border: 2px dashed #717171;
}
.modal-body .drag-upload-file {
	text-align: center;
}
.modal-body .drag-upload-icon {
	font-size: 100px;
	margin-bottom: 20px;
}
@media (min-width: 1000px) {
	.modal-dialog {
		width: 95%;
		max-width: 1000px;
	}
}
/*
* DASHBOARD
*/
.small-box .inner {
	height: 140px;
}
.small-box h3 {
	font-size: 38px;
	color: var(--main-gray);
}
.small-box h6 {
	color: var(--main-black);
	font-size: 16px;
	margin-top: 0;
	margin-bottom: 25px;
}
.small-box .icon {
	font-size: 100px;
	top: 0;
	right: 20px;
	color: var(--color-icon-alt);
}
.small-box .icon-alt {
	border-radius: 5px;
	font-size: 24px;
	width: 60px;
	padding: 15px 0;
	height: 60px;
	text-align: center;
	top: 40px;
	right: 20px;
	color: var(--white-ff-color);
}
.small-box .icon-alt i {
	text-shadow: 0 6px 8px rgb(62 57 107 / 18%);
}
.small-box:hover > .icon-alt {
	border-radius: 50%;
	font-size: 24px;
}
/*
* KANBAN
*/
.kanban-content {
	min-height: 250px;
    padding: 15px;
    margin-right: auto;
    margin-left: auto;
    padding-left: 15px;
    padding-right: 15px;
    padding-bottom: 0;
}
.kanban-col {
	max-width: 350px;
}
.kanban-padding .box-header,
.kanban-padding .box-footer {
	border-radius: var(--border-radius);
	display: flex;
	justify-content: center;
	align-items: center;
	white-space: initial;
} 
.kanban-scroll {
	min-height: 550px;
}
.kanban-scroll > #scroll-effect {
	position: fixed;
	width: 100%;
	top: 150px;
	bottom: 10px;
	overflow-x: scroll;
	overflow-y: hidden;
	white-space: nowrap;
	min-height: inherit;
}
.kanban-scroll > .row > .col-lg-3,
.kanban-scroll > .row > .col-lg-2 {
	display: inline-block;
	vertical-align: top;
	float: none;
}
.kanban-scroll > .row::-webkit-scrollbar {
	height: 13px;
}
.kanban-scroll > .row::-webkit-scrollbar-track {
	position: absolute;
	bottom: 0;
	background: var(--box-color);
}
.kanban-scroll > .row::-webkit-scrollbar-thumb:horizontal {
	background: darkgray;
	border-radius: 10px;
}
.dropdown-kanban > .dropdown-menu {
	width: 100%;
}
.kanban-line-right {
	border-right: 2px solid var(--hr-color);
}
.kanban-textarea {
	max-width: 100%;
	max-height: 125px;
}
.kanban-padding .box-header {
	color: var(--main-gray);
	border-top: 5px solid transparent;
}
.kanban-padding .box-header,
.kanban-padding .box-footer {
	padding: 12.5px;
}
.kanban-title {
	width: 90%;
	margin-top: 0;
	margin-bottom: 0;
}
.kanban-task {
	width: 100%;
	clear: both;
}
.kanban-task-inner {
	padding: 10px 8px 0 8px;
	margin: 3px 0 9px 0;
	color: var(--main-gray);
	background: var(--note-header);
	border: 1px solid var(--box-border-alt);
	box-shadow: 0 0 1px rgb(0 0 0 / 13%), 0 1px 3px rgb(0 0 0 / 20%);
	border-radius: 6px;
	overflow: hidden;
}
.dropdown-menu a {
  display: block;
  width: 100%;
  padding: 0;
  margin: 0;
}
.dropdown-menu a:hover {
  background-color: rgba(0, 0, 0, 0.1);
}
.pen-edit {
	opacity: 0;
}
.task-status {
	font-size: 14px;
}
.kanban-task-inner:hover {
}
.kanban-task-inner:hover .pen-edit {
	opacity: 1;
}
.kanban-task-inner-head {
	font-size: 16px;
	padding-bottom: 5px;
}
.kanban-input-group {
	border-color: var(--border-form) !important;
  background-color: var(--box-color) !important;
  color: var(--main-gray) !important;
}
.kanban-tools {
	width: 100%;
	margin: 5px 0;
	display: inline-block;
}
.kanban-task-inner-head h4,
.kanban-task-inner-head p,
.kanban-task-inner-head h5 {
	margin: 0;
	white-space: break-spaces;
}
.kanban-box {
	height: 95%;
	max-height: 60vh;
	display: flex;
	flex-direction: column;
	overflow-x: hidden;
	overflow-y: scroll;
}
.box-tasks {
	overflow: visible;
}
.kanban-box::-webkit-scrollbar {
	width: 7.5px;
}
.kanban-box::-webkit-scrollbar-track {
	background: var(--box-color);
}
.kanban-box::-webkit-scrollbar-thumb {
	background: darkgray;
	border-radius: 10px;
}
.kanban-mark {
	width: 100px;
	display: inline-block;
	border: 4px solid transparent;
	margin-bottom: 5px;
	border-radius: var(--border-radius);
}
.kanban_mark_box {
	padding: 5px 5px 5px 5px;
}
.kanban_mark_box a {
	display: inline-block;
	width: 23.5%;
	font-weight: 900;
	color: black;
	padding: 5px;
	height: 40px;
	overflow: hidden;
}
.kanban_mark_box a:hover {
	cursor: pointer;
	opacity: .6;
}
.kanban_status_1 {
	opacity: .6;
}
.box-tasks span {
	margin: 0 2.5px;
}
.btn-kanban-fix {
	position: relative;
	top: 20px;
}
.btn-kanban-menu {
	width: 100%;
	padding: 6px 12px;
	text-align: left;
	font-weight: 600;
	border: none;
	outline: none;
	border-radius: 6px;
	background: var(--date-picker-color);
}
.btn-task {
	width: 100%;
	padding: 0;
	color: var(--main-black);
	background: transparent;
	border: none !important;
}
.btn-kanban {
	padding: 10px 15px;
	border: 2px dashed var(--main-black);
	border-radius: 10px;
	color: var(--main-black);
	background: transparent;
}
.btn-kanban:hover,
.btn-task:hover {
	border-color: var(--ocean-color);
	color: var(--ocean-color);
}
.btn-action-menu {
	background: transparent;
	border: none;
	position: relative;
	top: 1.5px;
}
.delete_task:hover {
	background: var(--label-danger);
}
.task_file:hover {
	background: var(--label-new);
}
.task_mark:hover {
	background: var(--label-info);
}
.date_to_done:hover {
	background: var(--label-warning);
	color: #000;
}
/*
* HOVER EFFECT
*/
.main-header .navbar .nav > li > a:hover, 
.main-header .navbar .nav > li > a:active, 
.main-header .navbar .nav > li > a:focus,
.main-header .navbar .nav .open > a, 
.main-header .navbar .nav .open > a:hover, 
.main-header .navbar .nav .open > a:focus, 
.main-header .navbar .nav > .active > a,
.main-header .navbar .nav .switch-mode:hover,
.main-header .navbar .sidebar-toggle:hover {
	background: var(--bg-transporent);
	color: var(--white-f6-color);
}
.main-header .logo:hover {
	filter: brightness(1.2);
}
.sidebar-menu > li:hover > a,
.sidebar-menu .treeview-menu > li.active > a, 
.sidebar-menu .treeview-menu > li > a:hover {
	color: var(--ocean-color);
}
.btn,
.btn-flat,
.btn:hover,
.bnt-flat:hover {
	-webkit-transition: all .5s ease;
	-moz-transition: all .5s ease;
	-ms-transition: all .5s ease;
	transition: all .5s ease;
}
.btn:hover,
.bnt-flat:hover {
	border-radius: var(--border-radius);
	-webkit-box-shadow: 0 0 5px 0 rgb(43 43 43 / 10%), 0 11px 6px -7px rgb(43 43 43 / 10%);
    box-shadow: 0 0 5px 0 rgb(43 43 43 / 10%), 0 11px 6px -7px rgb(43 43 43 / 10%);
}
.datepicker .datepicker-switch:hover, 
.datepicker .next:hover, 
.datepicker .prev:hover, 
.datepicker tfoot tr th:hover,
.datepicker table tr td span.focused, 
.datepicker table tr td span:hover,
.datepicker table tr td.day.focused, 
.datepicker table tr td.day:hover {
	background: var(--date-picker-color);
}
/*
* PAGINATION
*/
.pagination>.disabled>a, 
.pagination>.disabled>a:focus, 
.pagination>.disabled>a:hover, 
.pagination>.disabled>span, 
.pagination>.disabled>span:focus, 
.pagination>.disabled>span:hover,
.pagination > li > a {
	background: var(--box-color);
	border-color: var(--border-form);
	color: var(--main-gray);
}
.pagination>li>a:focus, 
.pagination>li>a:hover, 
.pagination>li>span:focus, 
.pagination>li>span:hover {
	background: #e9ecef;
	border-color: var(--sb-active-sub-color);
}
.pagination>.active>a, 
.pagination>.active>a:focus, 
.pagination>.active>a:hover, 
.pagination>.active>span, 
.pagination>.active>span:focus, 
.pagination>.active>span:hover {
	background: var(--main-bg-color);
	border-color: var(--main-bg-color);
}
/*
* PAGE EDITOR AND PAGES
*/
.add-block {
	width: 100%;
	height: 200px;
	display: flex;
	color: var(--main-black);
}
.add-block i {
	margin: 0;
	width: 100%;
	font-size: 500%;
	display: flex;
  align-items: center;
  justify-content: center;
}
.add-block:hover {
	cursor: pointer;
	color: var(--label-new);
}
#add-block-edit:hover {
	color: var(--label-success);
}
#add-block-upload:hover {
	color: var(--label-info);
}
#page-box {
	margin-top: -150px;
}
/*
* REPORT
*/
.report-box {
	padding: 20px;
	position: relative;
	text-align: center;
}
.report-icon {
	width: 60px;
	height: 60px;
	padding: 15px 0;
	text-align: center;
	margin: 0 auto;
	color: var(--white-ff-color);
}
.report-icon i {
	font-size: 24px;
	text-shadow: 0 6px 8px rgb(62 57 107 / 30%);
}
/*
* SOCIAL NETWORK
*/
.social-box h3,
.social-box ul {
	display: inline-block;
}
.social-box h3 {
	color: #fff;
}
ul.social-networks {
	list-style: none;
	display: inline-block;
	margin: 0 !important;
	padding: 0;
}
ul.social-networks li {
	display: inline;
	margin: 0 5px;
	font-size: 24px;
	position: relative;
	top: 4px;
}
ul.social-networks li:hover {
	opacity: .7;
}
ul.social-networks .facebook a {
	color: #3B5998;
}
ul.social-networks .twitter a {
	color: #1da1f2;
}
ul.social-networks .instagram a {
	color: #c32aa3;
}
ul.social-networks .youtube a {
	color: #e52d27;
}
ul.social-networks .tiktok a {
	color: #69c9d0;
}
ul.social-networks .telegram a {
	color: #0088cc;
}
/*
* MEDIA
*/
@media (max-width: 767px) {
	.kanban-scroll > .row > .col-lg-3,
	.kanban-scroll > .row > .col-lg-2 {
		width: 80%;
	}
	.kanban-scroll > #scroll-effect {
		top: 200px;
	}
	.content-wrapper {
		margin-top: 100px;
	}
	.small-box h3 {
		font-size: 26px;
		white-space: break-spaces;
	}
	.small-box h6 {
		font-size: 14px;
	}
	.login-box-image {
		width: 100%;
		z-index: 1;
	}
	.navbar-nav .open .dropdown-menu>li>a {
		 padding: 1.2em 20px;
	}
}
/*
* FONT STYLE
*/
.f-w-100 {
	font-weight: 100;
}
.f-w-200 {
	font-weight: 200;	
}
.f-w-300 {
	font-weight: 300;
}
.f-w-400 {
	font-weight: 400;
}
.f-w-500 {
	font-weight: 500;
}
.f-w-600 {
	font-weight: 600;
}
.f-w-700 {
	font-weight: 700;
}
.f-w-800 {
	font-weight: 800;
}
.f-w-900 {
	font-weight: 900;
}
/*
* PADDING AND MARGIN
*/
.padding-xs {
  padding: .25em;
}
.padding-sm {
  padding: .5em;
}
.padding-md {
  padding: 1em;
}
.padding-lg {
  padding: 1.5em;
}
.padding-xl {
  padding: 3em;
}
.padding-x-xs {
  padding: .25em 0;
}
.padding-x-sm {
  padding: .5em 0;
}
.padding-x-md {
  padding: 1em 0;
}
.padding-x-lg {
  padding: 1.5em 0;
}
.padding-x-xl {
  padding: 3em 0;
}
.padding-y-xs {
  padding: 0 .25em;
}
.padding-y-sm {
  padding: 0 .5em;
}
.padding-y-md {
  padding: 0 1em;
}
.padding-y-lg {
  padding: 0 1.5em;
}
.padding-y-xl {
  padding: 0 3em;
}
.padding-top-xs {
  padding-top: .25em;
}
.padding-top-sm {
  padding-top: .5em;
}
.padding-top-md {
  padding-top: 1em;
}
.padding-top-lg {
  padding-top: 1.5em;
}
.padding-top-xl {
  padding-top: 3em;
}
.padding-right-xs {
  padding-right: .25em;
}
.padding-right-sm {
  padding-right: .5em;
}
.padding-right-md {
  padding-right: 1em;
}
.padding-right-lg {
  padding-right: 1.5em;
}
.padding-right-xl {
  padding-right: 3em;
}
.padding-bottom-xs {
  padding-bottom: .25em;
}
.padding-bottom-sm {
  padding-bottom: .5em;
}
.padding-bottom-md {
  padding-bottom: 1em;
}
.padding-bottom-lg {
  padding-bottom: 1.5em;
}
.padding-bottom-xl {
  padding-bottom: 3em;
}
.padding-left-xs {
  padding-left: .25em;
}
.padding-left-sm {
  padding-left: .5em;
}
.padding-left-md {
  padding-left: 1em;
}
.padding-left-lg {
  padding-left: 1.5em;
}
.padding-left-xl {
  padding-left: 3em;
}
.margin-xs {
  margin: .25em;
}
.margin-sm {
  margin: .5em;
}
.margin-md {
  margin: 1em;
}
.margin-lg {
  margin: 1.5em;
}
.margin-xl {
  margin: 3em;
}
.margin-x-xs {
  margin: .25em 0;
}
.margin-x-sm {
  margin: .5em 0;
}
.margin-x-md {
  margin: 1em 0;
}
.margin-x-lg {
  margin: 1.5em 0;
}
.margin-x-xl {
  margin: 3em 0;
}
.margin-y-xs {
  margin: 0 .25em;
}
.margin-y-sm {
  margin: 0 .5em;
}
.margin-y-md {
  margin: 0 1em;
}
.margin-y-lg {
  margin: 0 1.5em;
}
.margin-y-xl {
  margin: 0 3em;
}
.margin-top-xs {
  margin-top: .25em;
}
.margin-top-sm {
  margin-top: .5em;
}
.margin-top-md {
  margin-top: 1em;
}
.margin-top-lg {
  margin-top: 1.5em;
}
.margin-top-xl {
  margin-top: 3em;
}
.margin-right-xs {
  margin-right: .25em;
}
.margin-right-sm {
  margin-right: .5em;
}
.margin-right-md {
  margin-right: 1em;
}
.margin-right-lg {
  margin-right: 1.5em;
}
.margin-right-xl {
  margin-right: 3em;
}
.margin-bottom-xs {
  margin-bottom: .25em;
}
.margin-bottom-sm {
  margin-bottom: .5em;
}
.margin-bottom-md {
  margin-bottom: 1em;
}
.margin-bottom-lg {
  margin-bottom: 1.5em;
}
.margin-bottom-xl {
  margin-bottom: 3em;
}
.margin-left-xs {
  margin-left: .25em;
}
.margin-left-sm {
  margin-left: .5em;
}
.margin-left-md {
  margin-left: 1em;
}
.margin-left-lg {
  margin-left: 1.5em;
}
.margin-left-xl {
  margin-left: 3em;
}