/*common styles*/
* {
	box-sizing: border-box;
}
html, body {
	margin: 0;
	padding: 0;
	font-family: -apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol;
	font-size: 14px;
	font-weight: 300;
	line-height: 1.2;
	color: #202020;
	height: 100%;
}
#app {
	width: 100%;
	height: 100%;
}
a {
	text-decoration: none;
	color: #34495E;
	transition: all .3s;
}
a:hover {
	color: #1C4396;
}
img {
	max-width: 100%;
}
h1, h2, h3, h4, h5, h6 {
	margin: 0;
	font-weight: 600;
}
ul {
	margin:  0;
	padding: 0;
}
li {
	list-style: none;
}
button {
	font-family: inherit;
	font-size: 13px;
	color: #202020;
	text-decoration: none;
	cursor: pointer;
	background-color: transparent;
	border: none;
	padding: 0;
	margin: 0;
}
button:disabled {
	opacity: .3;
}
.hide {
	display: none;
}
.btn, .btn:visited {
	font-weight: 700;
	font-size: 13px !important;
	line-height: 17px;
	/* text-decoration: none; */
	padding: 6px 12px 7px;
	position: relative;
	display: inline-block;
	text-shadow: 0 1px 0 #fff;
	/* background: #f3f3f3; */
	white-space: nowrap;
	border: 1px solid #ddd;
	background: linear-gradient(linear,0 40%,0 70%,from(#f3f3f3),to(#f1f1f1));
	border-radius: 3px !important;
	color: #202020 !important;
	text-decoration: none !important;
	text-align: center;
}
.cancel, .cancel-link {
	color: #555;
	cursor: pointer;
	font-size: 13px;
	padding: 2px 5px;
	text-decoration: none;
	white-space: nowrap;
}
.cancel:hover, .cancel-link:hover {
	color: #1C4396;
}
.tw-btn, .tw-btn:visited {
	font-weight: 700;
	font-size: 13px !important;
	line-height: 17px;
	text-decoration: none;
	padding: 6px 12px 7px;
	position: relative;
	display: inline-block;
	text-shadow: 0 1px 0 #fff;
	background: #f3f3f3;
	white-space: nowrap;
	border: 1px solid #ddd;
	background: linear-gradient(linear,0 40%,0 70%,from(#f3f3f3),to(#f1f1f1));
	border-radius: 3px !important;
	color: #202020 !important;
	text-decoration: none !important;
	text-align: center;
}
.btn-red, .btn-red:visited {
	background: none;
	background-color: #1C4396;
	color: #fff !important;
	text-shadow: none;
	border: 1px solid transparent;
	color: #fff !important;
	background-color: #1C4396;
}
.cancel, .cancel-link {
    color: #555;
    cursor: pointer;
    font-size: 13px;
    padding: 2px 5px;
    text-decoration: none;
    white-space: nowrap;
}
.tip {
	display: none;
}

/*header*/
.dashboard-header {
	width: 100%;
	background-color: #1C4396;
	display: flex;
	align-items: center;
	padding-left: 42px;
	padding-right: 42px;
	height: 44px;
}
.dashboard-header-inner {
	height: 100%;
	width: 100%;
	display: flex;
	justify-content: space-between;
	position: relative;
}
.dashboard-header a {
	color: #fff;
}
.dashboard-header a.router-link-active {
	background-color: #ececec;
}
.header-left {
	display: flex;
	align-items: center;
}
.header-logo-wrap, .header-logo-wrap a {
	display: flex;
	align-items: center;
	justify-content: center;
	height: 100%;
}
.header-logo-wrap {
	margin-left: 10px;
} 
.header-ham, .header-home, .header-add, .header-icon, .header-right-btns a {
	width: 28px;
	height: 28px;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 16px;
	border-radius: 3px;
}
.header-right-btns a {
	margin-top: 2px;
}
.dashboard-header .header-right-btns a.router-link-active {
	background-color: hsla(0,0%,100%,.2);
}
.header-productivity, .header-faq, .header-notification {
	border-radius: 3px;
}
.dashboard-header .header-ham:hover, .dashboard-header .header-home:hover, .dashboard-header .header-menu ul li a:hover, .header-menu ul li a.router-link-active, .header-right-btns a:hover {
	background-color: hsla(0,0%,100%,.2);
}
.header-search {
	width: 236px;
	height: 35px;
	position: relative;
	margin-left: 19px;
	overflow: hidden;
	border-radius: 5px;
}
.header-search input[type="text"] {
	width: 100%;
	height: 100%;
	padding: 5px 10px;
	padding-right: 40px;
	border: 1px solid #ddd;
	outline: none;
	border-radius: 5px;
}
.header-search-submit {
	position: absolute;
	width: 35px;
	height: 35px;
	top: 0;
	right: 0;
}
.header-search-submit input {
	width: 100%;
	height: 100%;
	cursor: pointer;
	opacity: 0;
	position: relative;
	z-index: 9;
}
.header-search-submit .search_icon {
	position: absolute;
	top: 0;
	left: 0;
	width: 35px;
	height: 35px;
	display: flex;
	align-items: center;
	justify-content: center;
	background-color: #1C4396;
	color: #fff;
}


/*.header-search input {
	width: 100%;
	height: 100%;
	padding: 0 10px 0 35px;
	font-size: 14px;
	border: none;
	outline: none;
	background: #1C4396;
	transition: width .2s ease-in,background .15s cubic-bezier(.4,0,.2,1);
	color: #fff;
	transition: all .3s;
}*/
/*.header-search input:focus {
	outline: none;
	background-color: #fff;
	color: #34495E;
}*/
/*.header-search:hover input {
	background-color: #fff;
	color: #34495E;
}*/
/*.header-search i, .header-search svg {
	position: absolute;
	left: 5px;
	top: 5px;
	color: #fff;
	transition: all .3s;
} */ 
/*.header-search:hover svg, .header-search:focus svg {
	color: #202020;
} */
.header-right { 
	display: flex;
	align-items: center;
} 
/*.header-right > a:hover, .header-right > div:hover {
	background-color: hsla(0,0%,100%,.2);
}*/
.header-right > div.header-profile:hover {
	background-color: transparent;
}
.header-productivity-button .header-icon-text {
	font-size: 12px;
	margin-left: 4px;
}
.notification-has-number {
	position: relative;
}
.notification-has-number > span {
	position: absolute;
	background-color: red;
	width: 13px;
	height: 14px;
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 50%;
	font-size: 9px;
	font-weight: 600;
	line-height: 9px;
	top: -3px;
	right: 1px;
}
.header-productivity-button {
	width: 52px;
	display: flex;
	align-items: center;
	font-size: 16px;
	height: 28px;
	transition: all .3s;
	justify-content: center;
	margin-right: 1px;
}
.notification-dropdown {
	position: absolute;
	top: 26px;
	right: -42px;
	width: 400px;
	background-color: #fff;
	z-index: 999;
	box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
	color: #202020;
	border-radius: 4px;
	overflow: hidden;
	display: none;
}
.notification-has-number:hover .notification-dropdown {
	display: block;
}
.notification-dropdown .nd-list {
	height: 228px;
	overflow-y: auto;
}
.nd-header {
	padding: 8px 16px 7px;
	display: flex;
	align-items: center;
	justify-content: space-between;
	border-bottom: 1px solid #ddd;
}
.nd-list-single {
	padding: 10px 16px 12px;
	border-bottom: 1px solid #ddd;
	min-height: 73px;
	display: flex !important;
	flex-direction: column;
	justify-content: space-between !important;
	background-color: rgba(0,0,0,.04);
	width: 100% !important;
	align-items: flex-start !important;
}
.nd-list-single:hover {
	background-color: #E7E7E7 !important;
}
.nd-list-single:last-child {
	border-bottom: none;
}
.nd-header a {
	color: gray;
	font-size: 13px;
	width: auto;
	font-weight: 500;
}
.nd-header a:hover {
	color: #202020;
}
.nd-header h4 {
	margin: 0;
	font-size: 13px;
	font-weight: 700;
}
.nd-list-single p {
	margin: 0;
	font-size: 13px;
	margin-bottom: 4px;
	word-wrap: break-word;
	color: #202020;
	font-weight: 500;
}
.nd-list-single p b {
	font-weight: 700;
}
.nd-list-single span {
	font-size: 12px;
	color: grey;
	font-weight: 500;
}

.header-ham {
	margin-right: 5px;
}
.header-home {
	margin-right: 10px;
}
.header-add {
	margin-right: 1px;
}
.header-faq {
	margin-right: 0px;
}
.header-avatar {
	width: 32px;
	height: 32px;
	border-radius: 50%;
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center;
	cursor: pointer;
}
.header-right > div {
	margin-left: 11px;
}
.header-right-btns {
	margin-left: 30px !important;
}


/********************
	Content wrapper
********************/
.content-wrapper {
	display: flex;
	flex-grow: 1;
	flex-direction: row;
	overflow: hidden;
	height: calc(100% - 44px);
}

/*sidebar*/
.dashboard-sidebar {
	width: 255px;
	height: calc(100vh - 44px);
	padding-top: 30px;
	padding-left: 10px;
	position: fixed;
	left: 0;
	overflow: hidden;
	background-color: #fafafa;
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	transition: left 0.4s cubic-bezier(0.86, 0, 0.07, 1);
	scrollbar-width: thin;
	scrollbar-color: gray #d4dceb;
}
.dashboard-sidebar::-webkit-scrollbar, .board-section-body::-webkit-scrollbar {
  width: 7px;
  height: 7px;
}
.dashboard-sidebar::-webkit-scrollbar-thumb, .board-section-body::-webkit-scrollbar-thumb {
  background: gray;
  border: 3px solid gray;
  border-radius: 10px;
}
.dashboard-sidebar::-webkit-scrollbar-track, .board-section-body::-webkit-scrollbar-track {
  background: #d4dceb;
}
.dashboard-sidebar:hover {
	overflow-y: auto;
}
.dashboard-sidebar-resizer {
	width: 5px;
	margin-left: -2px;
	height: calc(100vh - 44px);
	padding-top: 30px;
	position: fixed;
	overflow-x: hidden;
	overflow-y: hidden;
	background-color: transparent;
	z-index: 199;
	cursor: col-resize;
	left: 255px;
}
.dashboard-sidebar-resizer:hover {
	background-color: #eee;
}
.dashboard-content {
	min-height: 380px;
	margin-left: 255px;
	position: relative;
	overflow: hidden auto;
	transition: margin-left 0.4s cubic-bezier(0.86, 0, 0.07, 1);
	display: flex;
	flex-grow: 1;
	flex-direction: column;
}
.dashboard-sidebar.sidebar-active {
	left: -425px;
}
.dashboard-sidebar-resizer.resizer-sidebar-active {
	display: none;
}
.dashboard-content.dashboard-sidebar-active {
	margin-left: 0;
}
.dashboard-sidebar-item-holder.dashboard-main-sidebar {
	padding-bottom: 30px;
}
.dashboard-sidebar-item-holder .sidebar-expansion-item:nth-child(2) .sidebar-expansion-options {
	display: block;
}
.dashboard-main-sidebar-list li a {
	min-height: 24px;
	font-size: 14px;
	color: #202020;
	list-style: none;
	cursor: pointer;
	padding: 5px 18px 5px 5px;
	transition: color .1s ease-in,background-color .1s ease-in;
	display: flex;
	align-items: center;
}
.dashboard-main-sidebar-list li a:hover, .dashboard-main-sidebar-list li a.router-link-active {
	background: #ececec;
}
.sidebar-list-icon {
	width: 28px;
	height: 24px;
	display: flex;
	align-items: center;
	justify-content: center;
	margin-right: 5px;
}
.sidebar-list-content {
	width: calc(100% - 33px);
	display: flex;
	align-items: center;
	justify-content: space-between;
}
.mail-icon {
	width: 22px;
}
.calender-icon {
	width: 15px;
}
.calender2-icon {
	width: 16px;
}
.sidebar-expansion-item {
	margin-top: 12px;
	transition: margin .3s cubic-bezier(.4,0,.2,1) 0ms;
}
.sidebar-expansion-title {
	padding: 1px 0;
	position: relative;
	font-size: 14px;
	line-height: 1em;
	background-color: #fafafa;
	display: flex;
	align-items: center;
	justify-content: space-between;
	min-width: 220px;
}
.sidebar-expansion-title-text-link:hover, .sidebar-expansion-title-text-link.router-link-active {
	color: #333;
	background-color: #ECECEC;
}
.sidebar-expansion-exp-trigger {
	width: 24px;
	margin: 0 12px 0 10px;
	text-align: center;
	height: 24px;
	line-height: 24px;
	cursor: pointer;
	transition: all .2s;
	color: gray;
	border-radius: 3px;
	visibility: visible;
	opacity: 1;
	margin-right: 16px;
	display: flex;
	align-items: center;
	justify-content: center;
}
.sidebar-expansion-exp-trigger a {
	display: flex;
	align-items: center;
}
.sidebar-expansion-title:hover .sidebar-expansion-exp-trigger {
	visibility: visible;
	opacity: 1;
}
.sidebar-expansion-exp-trigger:hover {
	color: #202020;
	background-color: #eee;
}
.sidebar-expansion-exp-trigger.sidebar-expansion-exp-trigger-teams {
	width: 24px;
	height: 36px;
	display: flex;
	align-items: center;
	justify-content: center;
}
.sidebar-expansion-exp-trigger.sidebar-expansion-exp-trigger-teams:hover {
	background-color: #ECECEC;
}
.sidebar-expansion-title-text {
	width: calc(100% - 44px);
	border: none;
	flex: 1;
	display: flex;
	text-align: left;
	font-size: 14px;
	color: #333;
	font-weight: 700;
	padding: 10px 0;
	cursor: pointer;
	background-color: transparent;
}
.sidebar-expansion-title-text-icon {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 38px;
	font-size: 16px;
	color: rgba(0,0,0,.54);
}
.sidebar-expansion-title-text-icon svg {
	transform: rotate(0);
	transition: all .3s;
}
.sidebar-expansion-title-text.toggle .sidebar-expansion-title-text-icon svg {
	transform: rotate(-90deg);
}
.expansion-option-item-content-right {
	width: 40px;
	height: 35px;
	display: flex;
	align-items: center;
	justify-content: flex-end;
	padding-right: 21px;
	font-size: 12px;
	color: grey;
}
/*.sidebar-expansion-options {
	display: none;
}*/
.sidebar-expansion-options ul {
	margin-left: -24px;
}
.sidebar-expansion-options ul li {
	position: relative;
	display: flex;
	align-items: center;
}
.expansion-option-drag {
	color: rgb(184, 184, 184);
	font-size: 16px;
	cursor: auto;
	transition: all .3s;
	display: flex;
	width: 24px;
	height: 24px;
	align-items: center;
	justify-content: center;
	opacity: 0;
	visibility: hidden;
}
/*.sidebar-expansion-options ul li:hover .expansion-option-drag {
	opacity: 1;
	visibility: visible;
}*/
.expansion-option-items {
	display: flex;
	align-items: center;
	transition: all .2s;
	width: calc(100% - 24px);
	min-width: 220px;
}
.expansion-option-items:hover, .expansion-option-items.router-link-active {
	background-color: #EEEEEE;
}
.expansion-option-arch {
	padding-top: 10px;
	padding-bottom: 5px;
	padding-left: 37px;
}
.expansion-option-arch a {
	font-size: 12px;
	color: #999;
}
.expansion-option-arch a:hover {
	color: #555;
}
.expansion-option-item-content-right svg {
	display: none;
	color: grey;
}
.expansion-option-items:hover .expansion-option-item-content-right svg {
	display: block;
}
.expansion-option-item-content-right svg:hover {
	color: #34495E;
}
.expansion-option-items:hover .expansion-option-item-content-right span {
	display: none;
}
.expansion-option-item-icon {
	width: 38px;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 8px 0;
	font-size: 10px;
	color: #B8B8B8;
}
.expansion-option-item-content-text {
	width: calc(100% - 40px);
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	display: block;
	float: left;
	color: #202020;
}
.expansion-option-item-content-text:hover {
	color: #202020;
}
.expansion-option-item-content-text span {
	width: 14px;
	margin-left: 4px;
	position: absolute;
}
.expansion-option-item-content {
	display: flex;
	align-items: center;
	width: calc(100% - 38px);
	cursor: pointer;
}
.sidebar-expansion-not-found {
	height: 35px;
	line-height: 35px;
	font-size: 12px;
	color: grey;
	padding-left: 12px;
}
/*header menu*/
.header-menu {
	margin-left: 25px;
}
.header-menu ul {
	padding: 0;
	display: flex;
	align-items: center;
}
.header-menu ul li {
	position: relative;
}
.header-menu ul li a {
	padding: 15px 12px;
	display: block;
	font-weight: 600;
}
.inbox.sidebar-list-icon {
	color: #246fe0;
}
.today.sidebar-list-icon {
	color: #058527;
}
.upcomming.sidebar-list-icon {
	color: #692fc2;
}
.header-menu .header-menu-sub {
	width: 210px;
	height: 180px;
	background-color: #fff;
	box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
	position: absolute;
	top: 45px;
	left: -67px;
	z-index: 999;
	flex-direction: column;
	justify-content: flex-start;
	align-items: flex-start;
	padding: 5px 0px;
	display: none;
}
.header-menu ul li:hover .header-menu-sub {
	display: flex;
}
.header-menu .header-menu-sub li {
	width: 100%;
}
.header-menu .header-menu-sub li a {
	display: flex;
	align-items: center;
	padding: 5px 10px;
}
.header-menu .header-menu-sub li a .sidebar-list-content {
	color: #333;
}
.header-menu .header-menu-sub a.router-link-active, .dashboard-header .header-menu .header-menu-sub a:hover {
    background-color: #ECECEC;
}

/*dashboard-content*/
.dashboard-content-inner {
	display: flex;
	flex-direction: column;
	flex-grow: 1;
}
.content-header-title-edit {
	max-width: calc(100% - 140px);
	width: 100%;
}
.dashboard-content-header {
	display: flex;
	background-color: #fff;
	flex-shrink: 0;
	position: sticky;
	top: 0;
	z-index: 9;
	padding: 36px 55px 20px;
	min-height: 91px;
}
.content-header-inner {
	width: 100%;
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
}
.content-header-actions {
	display: flex;
	align-items: center;
	color: #333;
}
.view-header-input {
	border-radius: 5px;
	border: 1px solid #ddd;
	box-sizing: border-box;
	font-size: 18px;
	line-height: 25px;
	margin: -4px 0 0;
	max-width: 100%;
	padding: 3px 8px 5px;
	width: 400px;
}
.content-header-title-edit-opts {
	margin-left: 10px;
	margin-bottom: 3px;
}
.content-header-actions a, .content-header-actions button {
	display: flex;
	align-items: center;
	margin-left: 16px;
	text-decoration: none;
	color: grey;
	border-radius: 3px;
}
.btn-add-in {
	padding: 5px;
}
.content-header-actions a:hover, .content-header-actions button:hover {
	background-color: #eee;
	color: #202020;
}
.content-header-actions a span, .content-header-actions button span {
	font-size: 12px;
	margin-left: 3px;
	margin-right: 6px;
	word-break: normal;
}
.dashboard-content-board {
	display: flex;
	flex-direction: column;
	flex-grow: 1;
}
.content-board-inner {
	display: flex;
	box-sizing: border-box;
	width: 100%;
	height: calc(100vh - 135px);
	padding: 0 47px 8px;
	align-items: flex-start;
	overflow-x: auto;
	overscroll-behavior-x: none;
	cursor: -webkit-grab;
	cursor: grab;
}
.board-add-section-area {
	position: relative;
	height: 100%;
	width: 0;
	margin: 0 !important;
	z-index: 2;
}
.board-add-section-btn {
	position: absolute;
	display: flex;
	top: 0;
	bottom: 0;
	left: -12px;
	width: 12px;
	align-items: center;
	justify-content: center;
	overflow: hidden;
	opacity: 0;
	transition: opacity .3s;
}
.board-add-section-btn ::after {
	content: "";
	display: block;
	position: absolute;
	top: 0;
	bottom: 0;
	left: 6px;
	border-left: 1px solid #1C4396;
	transition: opacity .3s;
}
.board-add-section-btn:focus, .board-add-section-btn:hover {
	overflow: visible;
	-webkit-transform: translateZ(0);
	z-index: 1;
	opacity: 1;
}
.board-add-section-label {
	z-index: 1;
	padding: 4px 8px;
	white-space: nowrap;
	font-size: 14px;
	font-weight: 700;
	color: #1C4396;
	background: #fff;
}
.board_section {
	display: flex;
	position: relative;
	flex-direction: column;
	box-sizing: border-box;
	width: 280px;
	max-height: 100%;
	padding: 0;
	margin-right: 12px;
	background-color: #fff;
	border: 1px solid transparent;
	border-radius: 5px;
}
.board-section-header {
	display: flex;
	justify-content: space-between;
	height: 44px;
	flex: 0 0 44px;
	padding: 0 8px;
	border-bottom: 1px solid transparent;
	transition: border-bottom-color .3s;
	width: 100%;
}
.board-section[data-draggable]:not([data-editing="true"]) .board-section-header {
	cursor: -webkit-grab;
	cursor: grab;
}
[data-editing="true"] .board-section-header {
	height: auto;
	flex-basis: auto;
}
.board-section-header::before {
	content: "";
	display: block;
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	border: 1px solid transparent;
	border-radius: 5px;
	pointer-events: none;
	transition-property: border-color,box-shadow;
	transition-duration: .3s;
}
.board-section-header:hover::before {
    border-color: #ccc;
    box-shadow: 0 2px 4px 0 rgba(0,0,0,.08);
}
.board-section {
	display: flex;
	position: relative;
	flex-direction: column;
	box-sizing: border-box;
	width: 280px;
	max-height: 100%;
	padding: 0;
	margin-right: 12px;
	background-color: #fff;
	border: 1px solid transparent;
	border-radius: 5px;
	cursor: auto;
}
.board-section-header-info {
	display: flex;
	align-items: center;
	flex: 1;
	min-width: 0;
	z-index: 1;
}
.board-section-header-menu-trigger {
	display: flex;
	align-items: center;
	padding: 0 4px;
	z-index: 1;
}
.board-section-title {
	margin: 0 4px 0 0;
	padding-right: 4px;
	font-size: 14px;
	line-height: 22px;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}
.board-section-header-info > span {
	font-size: 13px;
	line-height: 18px;
	color: grey;
}
.section-head-menu, .board-section-item-meta-menu-opts, .board-section-item-meta-menu-add {
	border-radius: 3px;
	display: flex;
	justify-content: center;
	align-items: center;
	width: 24px;
	height: 24px;
	color: grey;
	cursor: pointer;
}
.section-head-menu:not(:first-child) {
	margin-left: 6px;
}
.section-head-menu:hover, .board-section-item-meta-menu-opts:hover, .board-section-item-meta-menu-add:hover {
	color: #202020;
	background-color: #eee;
}
.task-hover-show {
	display: none;
}
.board-section-item:hover .task-hover-show {
	display: flex;
}
.task-assign-avatar {
	width: 19px;
	height: 19px;
	border-radius: 50%;
	background-repeat: no-repeat;
	background-size: cover;
	background-color: #B8B8B8;
}
.content-board-inner > * {
    flex-shrink: 0;
}
.board-section-header-info button {
	cursor: text;
	min-width: 0;
}
.board-section-header-edit {
	padding-top: 3px;
	z-index: 1;
	margin-bottom: 1em;
	width: 100%;
}
.board-section-header-edit input, .task-editor-input-fields input {
	box-sizing: border-box;
	width: 100%;
	height: 38px;
	border: 1px solid #ddd;
	border-radius: 5px;
	font-size: 14px;
	line-height: 30px;
	outline: 0;
	padding: 0 8px;
	cursor: text;
	font-weight: 700;
}
.board-section-header-edit-opts {
	margin-top: 10px;
	color: #555;
}
.board-section-header-edit-opts button[type="submit"] {
    margin-right: 5px;
}
.board-section-body {
	box-sizing: border-box;
	flex-shrink: 1;
	overflow-y: hidden;
	overflow-x: hidden;
	padding: 0 8px;
	scrollbar-width: thin;
	scrollbar-color: gray #d4dceb;
}
.board-section-body:hover {
	overflow-y: auto;
}
.board-section-item {
	box-sizing: border-box;
	position: relative;
	display: flex;
	width: 260px;
	margin: 0 0 10px;
	padding: 10px;
	background-color: #fff;
	border: 1px solid rgba(0,0,0,.12);
	border-radius: 5px;
	box-shadow: 0 2px 4px 0 rgba(0,0,0,.04);
	cursor: pointer;
	transition-property: border-color,box-shadow,background-color;
	transition-duration: .3s;
}
.board-section-item-task-btn {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}
.board-section-item-checkbox {
	position: relative;
	width: 28px;
	flex-shrink: 0;
}
.task-checkbox {
	width: 24px;
	height: 24px;
	cursor: pointer;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	display: flex;
	flex-shrink: 0;
	align-items: center;
	justify-content: center;
}
.task-checkbox-circle {
	display: flex;
	flex-shrink: 0;
	align-items: center;
	justify-content: center;
	background-color: transparent;
	color: grey;
	height: 16px;
	width: 16px;
	border: 1px solid grey;
	border-radius: 50%;
	font-size: 8px;
	transition: all .2s;
}
.task-checkbox-circle.task-completed {
	background-color: #00C040 !important;
	border-color: #00C040 !important;
	color: #fff;
}
.task-checkbox-circle i {
	opacity: 0;
	transition: all .2s;
}
.task-checkbox-circle.task-completed i {
	opacity: 1;
}
.task-checkbox:hover .task-checkbox-circle {
    background-color: hsla(0,0%,50.2%,.2);
}
.task-checkbox:hover i {
    opacity: 1;
}
.board-section-item-meta {
	position: relative;
	flex: 1;
}
.board-section-item-meta-details {
	display: flex;
	position: relative;
	align-items: stretch;
	justify-content: flex-start;
	min-height: 24px;
}
.board-section-item-meta-title {
	padding-right: 28px;
	position: relative;
	flex: 1;
	margin: 0;
	overflow: hidden;
}
.board-section-item-meta-menu {
	position: absolute;
	right: 0;
	top: 0;
	padding-left: 5px;
	display: flex;
	align-items: flex-start;
	justify-content: flex-end;
	transition: background-image .3s;
}
.board-section-item:hover .board-section-item-meta-menu {
	background-color: #fff;
}
.board-section-item-meta-menu-add {
	margin-left: 3px;
}
.board-section-item-meta-more {
	display: flex;
	position: relative;
	padding-top: 8px;
	align-items: center;
}
.board-section-item-meta-title h4 {
	padding-top: 2px;
	font-size: 12px;
	line-height: 19px;
	word-break: break-word;
	display: -webkit-box;
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;
	overflow: hidden;
}
.board-section-footer {
	box-sizing: border-box;
	min-height: 44px;
	display: flex;
	align-content: stretch;
	flex: 0 0 auto;
	padding: 0 8px;
	transition: border-top-color .3s;
	border-top: 1px solid transparent;
	z-index: 1;
}
.board-section[data-overflow-bottom] .board-section-footer {
    border-top-color: rgba(0,0,0,.12);
}
.bs-footer-add-task {
	flex: 1;
	padding-left: 13px;
}
.board-section[data-is-empty="true"] .bs-footer-add-task {
	padding-top: 4px;
	padding-left: 0;
}
.add-task-button {
	text-align: left;
	width: 100%;
	margin-left: -2px;
	padding: 0 0 8px;
	color: grey;
	font-size: 14px;
	white-space: nowrap;
}
.add-task-button:hover {
	color: #1C4396;
	text-decoration: none;
}
.add-task-icon {
	align-items: center;
	border-radius: 50%;
	color: #1C4396;
	display: inline-flex;
	height: 17px;
	justify-content: center;
	margin-right: 11px;
	-webkit-transform: translateY(8px);
	transform: translateY(8px);
	vertical-align: 7px;
	width: 17px;
}
.add-task-button:hover .add-task-icon {
	color: #fff;
	background-color: #1C4396;
}
.add-task-button:hover .add-task-icon svg {
	-webkit-transform: scale(.846);
	transform: scale(.846);
}
.bs-footer-add-task-editor {
	width: 260px;
	position: relative;
	padding: 0 0 12px;
	padding-top: 0px;
}
.board-section[data-overflow-bottom] .bs-footer-add-task-editor  {
    padding-top: 8px;
}
.task-editor-editing-area {
	border: 1px solid #ddd;
	border-radius: 5px;
	padding: 5px 10px 0;
	cursor: text;
}
.task-editor-editing-area:focus-within {
    border-color: rgba(0,0,0,.4);
}
.task-editor-input-fields {
	max-height: 200px;
	overflow-y: auto;
	overflow-x: hidden;
	margin-bottom: 5px;
}
.task-editor-btns {
	display: flex;
	justify-content: space-between;
	align-items: center;
	flex-wrap: wrap;
}
.task-editor-btns > div {
	display: flex;
	align-items: center;
	padding-bottom: 10px;
}
.task-editor-upper.icon-pillers {
	max-width: 100%;
}
.task-editor-upper.icon-pillers > * {
	margin-right: 8px;
}
.icon-piller {
	display: flex;
	box-sizing: border-box;
	justify-content: space-between;
	align-items: center;
	height: 28px;
	padding: 0 8px;
	border: 1px solid #ccc;
	border-radius: 5px;
	color: #555;
	transition: background-color .3s cubic-bezier(.4,0,.2,1);
}
.icon-piller:hover {
	background-color: #eee;
}
.due-item-btn, .projects-piller-btn {
	display: flex;
	flex-shrink: 0;
	align-items: center;
	color: #555;
	border-radius: 5px;
}
.due-item-btn .icon-calendar, .projects-piller-btn .icon-man {
	display: flex;
	align-items: center;
}
.due-item-btn .icon-calendar svg, .projects-piller-btn .icon-man svg {
	display: block;
	margin-right: 4px;
	margin-left: -2px;
}
.editor-actions {
	border-radius: 3px;
	display: flex;
	justify-content: center;
	align-items: center;
	width: 24px;
	height: 24px;
	color: grey;
	cursor: pointer;
}
.editor-actions:not(:first-child) {
	margin-left: 12px;
}
.editor-actions:not(:disabled):focus, .editor-actions:not(:disabled):hover {
    color: #202020;
    background-color: #eee;
}
.task-editor-content input {
	width: 100%;
	border: 0;
	outline: none;
	line-height: 21px;
	color: #34495E;
}
.task-editor-content input:focus {
	outline: none;
}
.task-editor-actions {
	padding: 10px 0 0;
}
.board-section-item-editor {
	width: 260px;
	margin-bottom: 10px;
}
.board-view-add-section {
	display: flex;
	width: 260px;
	min-height: 44px;
	padding: 2px 55px 0 8px;
	align-items: center;
	box-sizing: content-box;
}
.board-view-add-section > * {
	flex: 1;
}
.board-add-section-button {
	display: flex;
	align-items: center;
	color: grey;
	font-size: 14px;
	padding: 8px 15px;
	border-radius: 5px;
	background-color: #fafafa;
	width: 260px;
}
.board-add-section-button:hover {
	color: #1C4396;
}
.board-add-section-button svg {
	margin-right: 12px;
}
.board-add-section-button-icon-filled {
	display: none;
}
.board-add-section-button:hover .board-add-section-button-icon {
	display: none;
}
.board-add-section-button:hover .board-add-section-button-icon-filled {
	display: block;
}
/********************
	Popup
********************/
.popup-overlay {
	width: 100%;
	height: 100%;
	position: fixed;
	top: 0;
	left: 0;
	z-index: 9999;
	display: none;
	background-color: rgba(0,0,0,.5);
	align-items: center;
	justify-content: center;
}
.popup-overlay.popup-open {
	display: flex;
}
.popup-content-position {
	position: absolute;
	transform: translate(calc(50% + 335px), calc(50% + 143px));
}
.popup-content-wrapper {
	background-color: #fff;
	border-collapse: separate;
	border-radius: 3px;
	border: 1px solid #ddd;
	box-shadow: 0 1px 8px 0 rgba(0,0,0,.08);
	list-style: none;
	margin: 0;
	padding: 4px 0;
	position: relative;
	min-width: 100px;
	min-height: 100px;
	z-index: 999;
}
.task-options-module {
	width: 250px;
}
.menu-item-icon {
	display: flex;
	align-items: flex-start;
	line-height: 24px;
}
.menu-item {
	padding: 4px 10px;
	text-decoration: none !important;
}
.menu_item:hover {
	background-color: #f3f3f3;
	cursor: pointer;
}
.menu-item-icon-holder {
	color: grey;
	height: 24px;
	width: 24px;
	margin-right: 10px;
	display: flex;
	justify-content: center;
	align-items: center;
}
.menu-item-icon-content {
	flex: 1;
	color: #202020;
}
.menu-item.menu-item-icon.menu-item-icon-hover:hover > * {
	color: #de4c4a;
}
.menu-divider {
	margin: 4px;
	border-bottom: 1px solid #ddd;
}
.section-menu-item {
	padding: 4px 10px;
}
.section-menu-label {
	font-size: 12px;
	margin-bottom: .6em;
}
.scheduler-holder {
	white-space: nowrap;
}
.icon-scheduler {
	color: grey;
	border-radius: 3px;
	height: 28px;
	width: 28px;
}
.scheduler-holder > * {
	margin-left: 9px;
}
.scheduler-holder > :first-child {
	margin-left: 0;
}
.icon-scheduler.today {
	color: #058527;
}
.icon-scheduler.tomorrow {
	color: #ad6200;
}
.icon-scheduler.next-weekend {
	color: #246fe0;
}
.icon-scheduler.next-week {
	color: #692fc2;
}
.icon-scheduler:hover {
	background-color: #f3f3f3;
	text-decoration: none;
}
.icon-priority {
	display: inline-block;
	border: 1px solid transparent;
	border-radius: 3px;
	cursor: pointer;
	width: 28px;
	height: 28px;
	padding: 1px;
}
.icon-priority.is-selected {
    border-color: #ddd;
}
.icon-priority:hover {
	background-color: #f3f3f3;
} 
.priority-holder > * {
	margin-left: 16px;
}
.priority-holder > :first-child {
	margin-left: 0;
}
.quick-add-task-module {
	width: 580px;
	border-radius: 10px;
	box-shadow: 0 2px 8px 0 rgba(0,0,0,.16);
	background-color: #fff;
	display: flex;
	flex-direction: column;
	max-height: 100%;
	max-width: 100%;
}
.quick-add-task-module.reactist-modal-box-height-fit-content {
	flex-grow: 0;
}
.reactist-modal-box-header {
	position: relative;
	padding: 0 24px;
	display: flex;
	align-items: center;
	background-color: #fafafa;
	border-top-left-radius: 10px;
	border-top-right-radius: 10px;
	border-bottom: 1px solid #ddd;
}
.quick-add-header {
	border: none;
	background: #fff;
}
.reactist-modal-box-header hgroup {
	margin: 0;
	padding: 14px 0;
	font-weight: 700;
	flex-grow: 1;
}

.reactist-modal-box-header h1 {
	display: block;
	margin: 5px 0 0;
	font-size: 16px;
	font-weight: 700;
}
.quick-add-header h1 {
	font-size: 16px;
}
.reactist-modal-box-header-button button, .reactist-modal-box-header-button a {
	display: flex;
	align-items: center;
	justify-content: center;
	margin: 3px 0 0;
	border: none;
	background-color: transparent;
	border-radius: 3px;
}
.icon-close {
	cursor: pointer;
	color: grey;
}
.icon-close:hover {
	color: #202020;
}
.reactist-modal-box-body {
	padding: 20px 24px;
	padding-top: 20px;
	background-color: inherit;
}
.quick-add-task-module .quick-add_-body {
	display: flex;
	flex-direction: column;
	flex-grow: 1;
	box-sizing: border-box;
	width: 100%;
	overflow: auto;
	overflow-x: auto;
	overflow-x: auto;
	overflow-x: hidden;
	border-radius: 10px;
}
.reactist-modal-box-body.quick-add_-body {
	border-top-left-radius: 0;
	border-top-right-radius: 0;
}
.reactist-modal-box-body.quick-add_-body {
	padding-top: 0;
}
.header-profile-options {
	position: absolute;
	width: 276px;
	background-color: #fff;
	border-collapse: separate;
	border-radius: 3px;
	border: 1px solid #ddd;
	box-shadow: 0 1px 8px 0 rgba(0,0,0,.08);
	list-style: none;
	margin: 0;
	padding: 4px 0;
	margin-left: 0 !important;
	right: 0;
	z-index: 999;
	top: 38px;
	display: none;
}
.header-profile-options .menu-divider {
	margin-left: 0;
	margin-right: 0;
}
.header-profile-options ul li a:hover {
	background-color: #ECECEC;
}
.menu-item.menu-item-icon.menu-item-profile {
	flex-wrap: wrap;
}
.header-profile-options:hover {
	background-color: #fff !important;
}
.user-menu-details {
	width: 100%;
	display: flex;
	align-items: center;
	margin-left: 3px;
	margin-bottom: 5px;
}
.user-menu-details .header-avatar {
	width: 48px;
	height: 48px;
	margin-right: 14px;
}
.user-menu-details-text {
	width: calc(100% - 62px);
	display: flex;
	flex-direction: column;
	justify-content: center;
}
.user-menu-details-text strong {
	color: #202020;
	font-weight: 700;
	font-size: 16px;
	line-height: 1;
	margin-bottom: 4px;
}
.user-menu-details-text .user-menu-email {
	margin: 0;
	color: rgba(0,0,0,.56);
	line-height: 1;
}
.header-profile-options.popup-open {
	display: block;
}
.popup-module-global {
	box-shadow: 0 1px 8px 0 rgba(0,0,0,.08);
	border-radius: 5px;
	background-color: #fff;
}
.add-member-popup {
	width: 410px;
}
.popup-module-global-body {
	padding: 0 24px;
	padding-bottom: 30px;
}
.popup-inviter {
	display: flex;
	align-items: center;
	margin-bottom: 10px;
	margin-top: 10px;
}
.popup-inviter input {
	height: 32px;
	padding: 0 10px;
	border: 1px solid #eee;
	border-radius: 3px;
	width: 100%;
	margin-right: 20px;
	outline: none;
}
.popup-member-list {
	height: 318px;
	overflow-y: auto;
	overflow-x: hidden;
	border-bottom: 1px solid #eee;
}
.popup-member-list li a {
	display: flex;
	align-items: flex-start;
	padding: 10px 0;
}
.popup-member-list li .image {
	width: 25px;
	height: 25px;
	border-radius: 50%;
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center;
}
.popup-member-list-single {
	display: flex;
	padding: 10px 0;
	align-items: center;
}
.popup-member-list li .image {
	width: 25px;
	height: 25px;
	border-radius: 50%;
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center;
	margin-right: 10px;
}
.popup-member-list-content h6, .popup-member-list-content p {
	font-size: 11px;
	color: #555;
	margin: 0;
}
.popup-member-list-content h6 {
	font-weight: 700;
}
.popup-member-list-content p {
	font-size: 13px;
}
.popup-member-list-content {
	width: calc(100% - 35px);
	display: flex;
	align-items: center;
	justify-content: space-between;
}
.module-tab-body-area {
    width: 400px;
    max-width: 100%;
}
.popup-member-list-content-actions .section-head-menu {
	padding: 0;
	margin-right: 5px;
}
.popup-member-list-content-actions {
	background-color: #fff;
}
.module-tab-body-single {
    display: none;
}
.module-tab-body-single.active {
    display: block;
}
.module-tab-title {
	display: flex;
	align-items: center;
	justify-content: flex-start;
	margin-bottom: 15px;
	margin-top: 10px;
}
.module-tab-title-single {
    border-bottom: 1px solid #eee;
    color: #999;
    padding-bottom: 5px;
    width: 50%;
    text-align: left;
}
.module-tab-title-single:hover {
	color: #999;
}
.module-tab-title-single.active {
    font-weight: 700;
    color: #555;
    border-bottom: 1px solid #777;
}



/*Inbox*/
.content-header-inner-small {
	display: flex;
	width: 100%;
	padding-bottom: 0;
	max-width: 800px;
	margin: 0 auto;
	border-bottom: 1px solid transparent;
	transition: border-bottom-color .3s;
	align-items: flex-start;
	justify-content: space-between;
	word-break: break-word;
	margin-bottom: -10px;
}
.content-board-inner-small {
	padding-left: 55px;
	padding-right: 55px;
	max-width: 800px;
	margin: 0 auto;
	/*position: relative;*/
	z-index: 1;
	box-sizing: content-box;
}
.section-list {
	width: 100%;
}
.section-list > li {
	position: relative;
	padding-bottom: 18px;
	margin-bottom: 18px;
}
.task-list-item {
	font-size: 14px;
	border-bottom: 1px solid #f0f0f0;
}
.task-list-item-body {
	display: flex;
	align-items: stretch;
	position: relative;
	padding: 0;
	cursor: pointer;
}
.task-list-item-drag {
	position: absolute;
	top: 7px;
	left: -27px;
	width: 27px;
	padding-right: 3px;
	display: flex;
	flex-wrap: nowrap;
	height: 24px;
	opacity: 0;
	cursor: move;
	color: #808080;
	border-radius: 3px;
}
.task-list-item:hover .task-list-item-drag {
	opacity: 1;
}
.task-list-item-drag:hover {
	color: #202020;
	background-color: #eee;
}
.task-list-item-checkbox {
	display: flex;
	align-items: flex-start;
	justify-content: center;
	margin-right: 6px;
	padding-top: 7px;
}
.task-list-item-checkbox .image {
	width: 24px;
	height: 24px;
	border-radius: 50%;
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center;
}
.task-list-item-content {
	flex: 1;
	padding: 8px 0;
	margin-right: 30px;
}
.task-list-item-content-text {
	width: 100%;
	text-align: left;
	text-decoration: none;
	font-size: 14px;
	line-height: 21px;
	word-wrap: break-word;
	word-break: break-word;
	display: -webkit-box;
	-webkit-line-clamp: 4;
	-webkit-box-orient: vertical;
	overflow: hidden;
	margin-bottom: 3px;
}
.task-list-item-content-tags {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	margin: 0;
	padding: 0;
	min-height: 16px;
	width: calc(100% + 30px);
}
.task-list-item-content-tags > * {
	display: block;
	align-items: center;
	flex-wrap: nowrap;
	white-space: nowrap;
	height: 16px;
	line-height: 16px;
	font-size: 12px;
	color: grey;
	border-radius: 3px;
	margin: 0 8px 0 0;
}
.task-list-item-content-tags a, .task-list-item-content-tags button {
	display: flex;
	align-items: center;
	flex-wrap: nowrap;
	font-size: 12px;
}
.task-list-item-content-tags svg {
	margin-right: 3px;
}
.task-list-item-actions {
    display: flex;
    justify-content: flex-end;
    height: 24px;
    margin-right: 0;
    margin-top: 8px;
    padding-left: 0;
    position: absolute;
    right: 0;
    top: 0;
    align-items: center;
}
.accepted-colaborator {
    font-size: 12px;
    color: #5CB85C;
}
.pending-colaborator {
    color: #58BAD7;
}
.resend-colaborator {
    color: #5CB85C;
}
.remove-colaborator {
    color: #EB1F12;
}
.pending-colaborator, .resend-colaborator, .remove-colaborator {
    font-size: 12px;
    padding: 0 6px;
}
.task-list-item-actions button, .task-list-item-actions a {
	border-radius: 3px;
	display: flex;
	justify-content: center;
	align-items: center;
	width: 24px;
	height: 24px;
	color: grey;
	cursor: pointer;
	margin-left: 8px;
	opacity: 1;
}
.task-list-item-actions button:hover, .task-list-item-actions a:hover {
	color: #202020;
	background-color: #eee;
}
.task-list-item:hover .task-list-item-actions button, .task-list-item:hover .task-list-item-actions a {
	opacity: 1;
}
.task-list-item-add {
	padding: 0 20px 0 6px;
}
.hover-action-button {
	width: calc(100% - 30px);
	height: 24px;
	border: none;
	margin: 0;
	padding: 0;
	cursor: pointer;
	background: transparent;
	font-size: 14px;
	font-weight: 700;
	color: #1C4396;
	display: flex;
	flex: 1 1 auto;
	justify-content: center;
	align-items: center;
	position: relative;
	 opacity: 0;
	transition: opacity .3s cubic-bezier(.4,0,.2,1);
}
.hover-action-button {
	height: 24px;
	position: absolute !important;
	bottom: -18px;
	left: 0;
}
.hover-action-button:focus, .hover-action-button:hover {
	opacity: 1;
}
.hover-action-button::before, .hover-action-button::after {
	content: "";
	display: block;
	height: 1px;
	flex: 1 1 auto;
	opacity: .5;
	background-color: #1C4396;
}
.hover-action-button::before {
	margin-right: 10px;
}
.hover-action-button::after  {
	margin-left: 10px;
}
.list-header {
	display: flex;
	align-items: center;
	position: sticky;
	top: 87px;
	background-color: #fff;
	border: #ddd;
	font-size: 14px;
	border-bottom: 1px solid #f0f0f0;
	padding: 0;
	z-index: 2;
}
.section-head-drag {
	position: initial;
	padding-right: 0;
}
.section-head-title {
	text-align: left;
	padding: 6px 30px 5px 0;
	line-height: 20px;
	font-size: 14px;
	font-weight: 700;
	flex: 1;
	margin: 0;
	word-wrap: break-word;
	word-break: break-word;
	cursor: text;
}
.section-head-actions {
	display: flex;
	align-items: center;
}
.section-head-title small {
	color: grey;
	margin-left: 6px;
	font-size: 12px;
	font-weight: 400;
}
.section-head-overflow-actions {
	width: 24px;
	display: flex;
	height: 24px;
	position: absolute;
	left: -24px;
	cursor: pointer;
}
.list-header:hover .section-head-drag {
	opacity: 1;
}
.task-list-item-collapser {
	width: 24px;
	height: 24px;
	position: relative;
	left: 0;
	border-radius: 3px;
	color: grey;
}
.task-list-item-collapser.toggle svg {
	transform: rotate(-90deg);
}
.task-list-item-collapser:hover {
	color: #202020;
	/*background-color: #eee;*/
}
.hover-action-button-area {
	height: 24px;
	position: absolute !important;
	bottom: -18px;
	left: 0;
	width: 100%;
}
.task-list-item-editor {
	padding: 4px 0 !important;
	background: none !important;
	margin-bottom: 9px;
}
.task-editor-input-fields input {
	border: none;
	height: 21px;
	font-weight: 400;
}
.task-editor-extra-fields {
	display: flex;
	justify-content: space-between;
	align-items: center;
	flex-wrap: wrap;
}
.task-editor-select-client {
	margin-top: 10px;
}
.task-editor-select-client select {
	border: 1px solid #ddd;
	border-radius: 5px;
	padding: 7px 10px;
	width: 100%;
	font-size: 14px;
	line-height: 30px;
	color: gray;
}
.task-editor-extra-pillers {
	display: flex;
	align-items: center;
	padding-bottom: 10px;
}
.task-editor-extra-pillers .due-item-btn.icon-piller {
	margin-right: 8px;
}
.task-editor-extra-fields .icon-inbox {
	display: flex;
	margin-right: 2px;
	color: #246fe0;
}
.task-editor-extra-actions {
	display: flex;
	align-items: center;
	padding-bottom: 10px;
	flex-shrink: 0;
}
.task-editor-extra-actions button {
	border-radius: 3px;
	display: flex;
	justify-content: center;
	align-items: center;
	width: 24px;
	height: 24px;
	color: grey;
	cursor: pointer;
}
.task-editor-extra-actions button:hover {
	color: #202020;
	background-color: #eee;
}
.task-editor-extra-actions button:not(:first-child) {
	margin-left: 12px;
}
.content-header-inner h1 small {
	color: grey;
	margin-left: 6px;
	font-size: 12px;
	font-weight: 400;
}
.task-list-item-content-tags-right a {
	height: 16px;
	display: flex;
	margin-left: auto;
	margin-right: -30px;
}
.project-icon.project-icon-inbox {
	color: #246fe0;
}

/*upcomming page*/
.upcoming-view-calendar-wrap {
	background-color: #fff;
	display: flex;
	justify-content: center;
	position: sticky;
	width: 100%;
	top: 0;
	z-index: 2;
	flex-shrink: 0;
}
.upcoming-view-calendar {
	padding-top: 36px;
	padding-left: 55px;
	padding-right: 55px;
	width: 100%;
	max-width: 800px;
	box-sizing: content-box;
}
.upcoming-view-calendar-controls {
	display: flex;
	margin-bottom: 12px;
	align-items: center;
}
.upcoming_-view-calendar-control-picker {
	display: flex;
	font-size: 20px;
	font-weight: 600;
}
.upcoming_-view-calendar-control-picker svg {
	color: grey;
}
.upcoming-view-calendar-controls-nav {
	display: flex;
	border: 1px solid #ccc;
	border-radius: 5px;
	margin-left: auto;
	margin-right: 8px;
	line-height: 26px;
	height: 26px;
	overflow: hidden;
}
.upcoming-view-calendar-controls-nav .separator {
	border-left: 1px solid #eee;
}
.upcoming-view-calendar-controls-nav button {
	color: grey;
	transition: background-color .3s cubic-bezier(.4,0,.2,1);
	padding: 0 2px;
}
.upcoming-view-calendar-controls-nav button:hover {
	background-color: #eee;
	color: #202020;
}
.styled-button {
	display: flex;
	box-sizing: border-box;
	justify-content: center;
	align-items: center;
}
.styled-button-pill {
	line-height: 24px;
	height: 28px;
	padding: 0 8px;
	border: 1px solid #ccc;
	border-radius: 5px;
	color: #555;
	transition: background-color .3s cubic-bezier(.4,0,.2,1);
}
.styled-button-pill:hover {
    background-color: #eee;
    color: #202020;
}
.upcoming-view-calendar .calendar {
	border-bottom: 1px solid #f0f0f0;
}
.calendar-weeks {
	display: flex;
	flex-direction: column;
}
.calendar-week {
	flex-grow: 1;
	outline: none;
}
.calendar-week {
	flex-grow: 1;
	outline: none;
	display: flex;
}
.upcoming-view-calendar .calendar-spacer, .upcoming-view-calendar .upcoming-view-day-cell {
	display: flex;
	flex-direction: column;
	line-height: inherit;
	font-size: 16px;
	padding-top: 4px;
	padding-bottom: 8px;
}
.calendar-header > *, .calendar-week > * {
	width: 14.28571%;
	text-align: center;
}
.calendar-spacer {
	opacity: .15;
}
.upcoming-view-calendar .calendar-spacer {
	opacity: 1;
}
.upcoming-view-calendar .calendar-spacer-weekday, .upcoming-view-calendar .upcoming-view-day-cell-weekday {
	font-weight: 400;
	font-size: 12px;
	color: grey;
	height: 16px;
	line-height: 16px;
}
.upcoming-view-calendar .calendar-spacer-date, .upcoming-view-calendar .upcoming-view-day-cell-date {
	line-height: 20px;
}
.upcoming-view-calendar .calendar-spacer .upcoming-view-day-cell-date {
	opacity: .15;
}
.calendar-day {
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: center;
}
.upcoming-view-calendar .upcoming-view-day-cell {
    transition: background-color .3s cubic-bezier(.4,0,.2,1);
}
.upcoming-view-calendar .calendar-day-greyed {
	color: #202020;
}
.upcoming-view-calendar .upcoming-view-day-cell-current .upcoming-view-day-cell-date, .upcoming-view-calendar .upcoming-view-day-cell.calendar-day-selected .upcoming-view-day-cell-date {
	font-weight: 600;
}
.upcoming-view-calendar .upcoming-view-day-cell:focus.upcoming-view-day-cell-current, .upcoming-view-calendar .upcoming-view-day-cell:hover.upcoming-view-day-cell-current {
	color: #1C4396;
}
.upcoming-view-calendar .upcoming-view-day-cell:hover {
	background-color: #eee;
}
.section-list.upcoming-section-list {
	padding-top: 28px;
}
.list-header {
	display: flex;
	align-items: center;
	position: sticky;
	top: 89px;
	background-color: #fff;
	border: #ddd;
	font-size: 14px;
	border-bottom: 1px solid #f0f0f0;
	padding: 0;
	z-index: 2;
}
.upcoming-overdue-area .task-list-item-content-tags {
	justify-content: space-between;
}
.date-overdue {
	color: #d1453b !important;
}
.upcoming-section-list .list-header {
	top: 125px;
}
.task-list-item-content-tags.task-list-item-content-tags-right {
	width: 100%;
}
.section-head-title.section-head-title-empty {
	color: grey;
}
.upcoming-view-calendar .upcoming-view-day-cell::after {
	position: absolute;
	content: "";
	left: 0;
	width: 100%;
	height: 2px;
	border-bottom: 2px solid #1C4396;
	bottom: -1px;
	opacity: 0;
}
.upcoming-view-calendar .upcoming-view-day-cell.appear-done::after, .upcoming-view-calendar .upcoming-view-day-cell.enter-done::after, .upcoming-view-calendar .upcoming-view-day-cell.exit::after {
	opacity: 1;
}

/*settings*/
.settings-area {
	max-width: 1060px;
	/*box-shadow: 0 2px 8px 0 rgba(0,0,0,.16);*/
	margin-left: 55px;
}
.settings-page-title {
	padding: 10px 16px;
	font-size: 20px;
	font-weight: 700;
	border-bottom: 1px solid #e6e6e6;
	position: sticky;
	top: 0;
	background-color: #fff;
	z-index: 9;
	min-height: 60px;
	display: flex;
	align-items: center;
}
.settings-label {
	font-weight: 700;
}
.settings-items {
	padding: 24px 16px;
}
.settings-plan {
	display: flex;
	justify-content: space-between;
	align-items: flex-end;
	padding-bottom: 24px;
}
.settings-plan > span {
	font-size: 16px;
	font-weight: 700;
}
.settings-single .btn {
	font-weight: 400;
	color: rgba(0,0,0,.88) !important;
	border-color: #d6d6d6;
	border-radius: 5px !important;
}
.settings-single .btn:hover {
	background-color: #ebebeb;
}
.settings-single .btn-danger {
	color: #c83d33 !important;
	border-color: #c83d33 !important;
}
.settings-single .btn.btn-red {
	color: #fff !important;
}
.settings-single .btn.btn-red:hover {
	background-color: #1C4396;
}
.settings-devider {
	border-bottom: 1px solid #e6e6e6;
	margin-bottom: 24px;
}
.settings-photo .imge {
	width: 80px;
	height: 80px;
	background-repeat: no-repeat;
	background-position: center;
	background-size: cover;
	border-radius: 50%;
	margin-right: 12px;
}
.settings-photo {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	padding-top: 8px;
	padding-bottom: 24px;
}
.settings-photo-btns {
	width: calc(100% - 102px);
	margin-top: 14px;
}
.settings-photo-btns .btn.btn-danger {
	margin-left: 8px;
}
.settings-photo-notice {
	margin-top: 8px;
	font-size: 12px;
	color: rgba(0,0,0,.56);
}
.settings-single input[type="text"], .settings-single input[type="number"] {
	color: rgba(0,0,0,.88);
	box-sizing: border-box;
	background: transparent;
	font-size: 14px;
	line-height: 18px;
	padding: 6px 10px;
	width: 400px;
	border: 1px solid #e6e6e6;
	border-radius: 5px;
	outline: none;
}
.settings-content, .settings-email {
	margin-top: 8px;
	margin-bottom: 24px;
}
.settings-email > span {
	display: block;
	margin-top: ;
	margin-bottom: 8px;
}
.settings-connected {
	padding-top: 8px;
}
.settings-connected > span {
	font-size: 12px;
	color: rgba(0,0,0,.56);
	margin-bottom: 16px;
	display: block;
}
.settings-connected p {
	margin-top: 0;
	margin-bottom: 8px;
}
.settings-connected strong {
	font-weight: 700;
}
.settings-connected p a {
	color: #1C4396;
}
.settings-connected-btns {
	margin: 16px 0;
}
.settings-connected-btns .btn.social-accs {
	display: flex;
	align-items: center;
	margin-bottom: 16px;
	align-items: ;
	justify-content: center;
	max-width: 300px;
}
.settings-delete > span {
	color: #c83d33;
	display: block;
	margin-top: 8px;
	margin-bottom: 8px;
	font-size: 12px;
}
.settings-dropdown {
	max-width: 400px;
	margin-top: 8px;
	margin-bottom: 24px;
}
.settings-dropdown select {
	width: 100%;
	color: rgba(0,0,0,.88);
	background: none;
	border-radius: 5px;
	border: 1px solid #d6d6d6;
	font-size: 14px;
	line-height: 18px;
	padding: 6px 10px;
	margin: 0;
}
.settings-dropdown select:focus {
	outline: none;
}
.settings-company .settings-single {
	display: flex;
	align-items: center;
	justify-content: space-between;
}
.settings-single .settings-single-item {
	width: calc(50% - 20px);
}
.settings-single .settings-single-item input, .settings-single .settings-single-item select, .popup-select-box select {
	width: 100%;
}
.settings-single-item select, .popup-select-box select {
	color: rgba(0,0,0,.88);
	box-sizing: border-box;
	background: transparent;
	font-size: 14px;
	line-height: 18px;
	padding: 7px 10px;
	border: 1px solid #e6e6e6;
	border-radius: 5px;
	outline: none;
}
.settings-single-item .settings-label {
	margin-bottom: 5px;
}
.settings-single-item {
	margin-bottom: 15px;
}
.popup-select-box {
	margin-bottom: 10px;
	margin-top: 10px;
}

/*screenshot page*/
.sc-header {
	background-color: #fff;
	position: sticky;
	top: 0;
	z-index: 99;
}
.sc-header-top {
	padding: 10px 55px 10px 55px;
	border-bottom: 1px solid #DEDEDE;
	display: flex;
	align-items: center;
	justify-content: space-between;
	height: 60px;
}
.sc-header-top-left {
	width: 50%;
	display: flex;
	align-items: center;
}
.sc-header-title {
	font-size: 20px;
	font-weight: 600;
	color: #1C4396;
	padding-right: 13px;
	margin-right: 13px;
	position: relative;
}
.sc-header-date-text {
	font-size: 15px;
	font-weight: 600;
}
.sc-header-date-text span {
	color: #1C4396;
}
.sc-header-title::after {
	content: '';
	width: 1px;
	height: 19px;
	background-color: #DEDEDE;
	position: absolute;
	right: 0;
	top: 4px;
}
.sc-header-name {
	display: flex;
	align-items: center;
}
.sc-header-name img {
	width: 10px;
	margin-left: 3px;
	margin-top: 5px;
}
.avater {
	width: 20px;
	height: 20px;
	border-radius: 50%;
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center;
	margin-right: 4px;
}
.report-summery-header-profile .avater {
	background-size: cover;
}
.sc-header-name span {
	font-size: 14px;
	font-weight: 600;
	color: #B8BACE;
}
.sc-header-top-right {
	width: 50%;
	display: flex;
	align-items: center;
	justify-content: flex-end;
}
.sc-header-gmt select, .sc-header-select select {
	background: no-repeat;
	outline: none;
	font-size: 14px;
	font-weight: 500;
	color: #B8BACE;
	box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
	border: 1px solid #ccc;
	height: 34px;
	padding: 5px 7px;
	border-radius: 4px;
}
.sc-header-gmt {
	margin-right: 24px;
}
.sc-header-date a {
	min-height: 34px;
	border: 1px solid #DEDEDE;
	border-radius: 3px;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 10px 21px;
}
.sc-header-date.sc-header-date-no-padding a {
	padding: 0;
	border: 0;
}
.sc-header-date span {
	font-size: 14px;
	color: #B8BACE;
	margin-right: 9px;
}
.sc-header-date img {
	width: 14px;
}
.sc-header-date-nav {
	display: flex;
	align-items: center;
}
.sc-header-date-submit .btn {
	width: 100px;
	height: 39px;
	margin-left: 10px;
	line-height: 39px;
	padding: 0;
	font-size: 16px;
}
.sc-header-date-nav a {
	width: 38px;
	height: 39px;
	border: 1px solid #DEDEDE;
	border-radius: 3px;
	display: flex;
	align-items: center;
	justify-content: center;
	margin-left: 10px;
}
.sc-header-bottom {
	padding: 10px 86px 10px 50px;
	min-height: 62px;
	display: flex;
	align-items: center;
	justify-content: space-between;
}
.sc-header-select-all {
	display: flex;
	align-items: center;
	font-size: 14px;
	font-weight: 600;
	color: #B8BACE;
}
.sc-header-select-all input {
	margin: 0;
	width: 14px;
	height: 14px;
	margin-right: 5px;
}
.sc-header-btns {
	display: flex;
	align-items: center;
	margin-right: 17px;
}
.sc-header-btns a {
	display: flex;
	align-items: center;
	font-size: 14px;
	color: #B8BACE;
	font-weight: 500;
}
.sc-header-btns a span {
	margin-left: 2px;
}
.sc-header-btns .download-image {
	width: 23px;
}
.sc-header-btns .delete-image {
	width: 16px;
	margin-right: 1px;
}
.sc-header-btns hr {
	width: 1px;
	height: 24px;
	color: #DEDEDE;
	margin: 0 27px;
}
.sc-wrapper {
	/*background-color: #E5E5E5;*/
	padding: 50px 86px 100px 50px;
}
.sc-single-time {
	margin-bottom: 10px;
}
.sc-single-header {
	display: flex;
	align-items: center;
	margin-bottom: 26px;
}
.sc-single-header-dot {
	width: 18px;
	height: 18px;
	background-color: #fff;
	border-radius: 50%;
	border: 1px solid #B8BACE;
	margin-right: 25px;
	margin-left: -9px;
}
.sc-single-header-time {
	font-size: 17px;
	font-weight: 700;
	color: #1C4396;
	text-transform: uppercase;
	padding-right: 16px;
	margin-right: 20px;
	position: relative;
}
.sc-single-header-time::after {
	content: ;
	content: '';
	width: 1px;
	height: 14px;
	background-color: #B8BACE;
	position: absolute;
	right: 0;
	top: 5px;
}
.sc-single-header-date {
	font-size: 14px;
	color: #9296C1;
	font-weight: 500;
}
.sc-boxs {
	padding-left: 35px;
	display: flex;
	flex-wrap: wrap;
	position: relative;
}
.sc-boxs::before {
	content: '';
	width: 1px;
	height: calc(100% - 20px);
	background-color: #B8BACE;
	position: absolute;
	left: 0;
}
.sc-single-box {
	width: 262px;
	background-color: #fff;
	border-radius: 5px;
	padding: 15px 19px 19px;
	margin-bottom: 20px;
	margin-right: 20px;
	box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
}
.sc-single-box-header {
	display: flex;
	margin-bottom: 16px;
}
.sc-single-box .texts {
	width: calc(100% - 16px);
}
.sc-single-box .texts h5 {
	font-size: 14px;
	font-weight: 600;
	color: #1C4396;
	margin-bottom: 2px;
}
.sc-single-box .texts p {
	margin: 0;
	font-size: 11px;
	font-weight: 500;
	color: #B8BACE;
}
.sc-single-box-image {
	display: block;
	width: 100%;
	height: 127px;
	border-radius: 5px;
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center;
	margin-bottom: 11px;
}
.sc-single-box-mets {
	display: flex;
	align-items: center;
	justify-content: space-between;
	font-size: 14px;
	font-weight: 600;
	color: #1C4396;
	text-transform: uppercase;
	margin-bottom: 20px;
}
.sc-single-box-activity-single {
    display: flex;
    align-items: center;
    position: relative;
}
.sc-single-box-activity-single:first-child {
	margin-bottom: 10px;
}
.sc-single-box-activity-single .image {
	width: 12px;
	display: flex;
	align-items: center;
	justify-content: center;
	margin-right: 8px;
}
.sc-single-box-fill {
    width: calc(100% - 50px);
    height: 10px;
    background-color: #F5F5F5;
    border-radius: 5px;
    overflow: hidden;
    position: relative;
}
.sc-single-box-fill span {
    display: block;
    height: 100%;
    background-color: #1FEF40;
}
.sc-single-box-fill span p {
    margin: 0;
    font-size: 9px;
    font-weight: 700;
    position: absolute;
    top: 0;
    color: #1C4396;
    left: calc(50% - 8px);
}
.sc-single-box-activity-single p {
    width: 30px;
    text-align: right;
    font-size: 12px;
    font-weight: 700;
    margin: 0;
}
.sc-single-box-activity-single-count {
    position: absolute;
    background-color: #fff;
    padding: 5px 30px;
    font-size: 14px;
    font-weight: 700;
    box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
    top: -28px;
    left: 62px;
    display: none;
}
.sc-single-box-activity-single:hover .sc-single-box-activity-single-count {
    display: block;
}
.sc-single-box-header-checkbox {
    position: relative;
    display: none;
}
.sc-single-box-header-checkbox input {
	padding: 0;
	height: initial;
	width: initial;
	margin-bottom: 0;
	display: none;
	cursor: pointer;
	margin-right: 0;
}
.sc-single-box-header-checkbox label {
	position: relative;
	cursor: pointer;
}
.sc-single-box-header-checkbox label::before {
	content: '';
	width: 16px;
	height: 16px;
	position: absolute;
	top: 16px;
	right: -16px;
	background-color: #F5F5F5;
	border-radius: 2px;
	border: 1px solid #E6E6E6;
}
.sc-single-box-header-checkbox input:checked + label::before {
	background-color: #1C4396;
	border-color: #1C4396;
}
.sc-single-box-header-checkbox input:checked + label::after {
	content: '';
	display: block;
	position: absolute;
	top: 18px;
	left: 5px;
	width: 3px;
	height: 8px;
	border: solid #fff;
	border-top-width: medium;
	border-right-width: medium;
	border-bottom-width: medium;
	border-left-width: medium;
	border-width: 0 2px 2px 0;
	transform: rotate(45deg);
}

/*Report page*/
.report-box-area {
	min-height: calc(100vh - 104px);
	padding: 5px 55px;
}
.report-box-single-line {
	display: flex;
}
.report-box-single-line {
	display: flex;
	border: 1px solid #DEDEDE;
	min-height: 42px;
	border-top: none;
	font-size: 15px;
	font-weight: 600;
}
.border-none, .report-box-single-line.border-none .report-box-ht1, .report-box-wwo1.report-box-title, .report-box-wwo2.report-box-title {
	border:  none;
}
.border-top {
	border-top: 1px solid #DEDEDE;
}
.border-bottom {
	border-bottom: 1px solid #DEDEDE;
}
.report-box-ht1 {
	width: 37%;
	display: flex;
	align-items: center;
	border-right: 1px solid #DEDEDE;
	padding: 0 30px;
}
.mx-input {
	box-shadow: none;
}
.report-summery-tabs-item .report-box-ht1, .report-summery-tabs-item .report-box-ht2 {
	padding: 0 10px;
}
.report-box-ht2 {
	width: 63%;
	display: flex;
	align-items: center;
	padding: 10px 30px;
}
.pt-hour-min span {
	width: auto !important;
	margin-right: 9px;
}
.pt-hour-min span:first-child {
	font-weight: 700;
	color: #1C4396;
}
.report-box-title, .report-box-title a {
	color: #B8BACE;
}
.report-box-title-sign {
	display: flex;
	align-items: center;
}
.report-box-ht2.report-box-title {
	justify-content: space-between;
}
.report-box-title-right a:not(:first-child) {
	margin-left: 30px;
}
.report-box-title-right a:hover, .report-box-title-right a.active {
	color: #1C4396;
}
.report-box-single-line label {
	font-size: 17px;
	color: #1C4396;
}
.report-box-ht1-name .avater {
	width: 30px;
	height: 30px;
	margin-right: 10px;
}
.avater.pt-avatar {
	border-radius: 0;
}
.report-box-ht2-hour span {
	width: 110px;
}
.report-box-ht1-hour-fill {
	width: 440px;
}
.fill-line {
	height: 8px;
	background-color: #DEDEDE;
	border-radius: 6px;
	overflow: hidden;
}
.fill-line span {
	display: block;
	background-color: #1FEF40;
	height: 100%;
}
.report-box-ac5 .fill-line span {
	background-color: #F20D0D;
}
.web-app-fill p {
    margin: 0;
    color: #333;
    font-size: 10px;
    /* display: none; */
    margin-left: 7px;
    text-align: center;
    margin-top: -3px;
}
.report-box-ht2-hour:hover p {
	display: block;
}
.report-box-wwo1 {
	width: 40%;
	display: flex;
	align-items: center;
	padding: 10px 30px;
	border-right: 1px solid #DEDEDE;
}
.report-box-wwo2 {
	width: 10%;
	display: flex;
	align-items: center;
	padding: 10px 30px;
	border-right: 1px solid #DEDEDE;
}
.report-box-wwo3 {
	width: 50%;
	display: flex;
	align-items: center;
	padding: 10px 30px;
}
.settings-page-footer {
	display: flex;
	align-items: center;
	justify-content: flex-end;
	padding: 10px 0;
	border-top: 1px solid #e6e6e6;
	position: sticky;
	bottom: 0;
	left: 0;
	background-color: #fff;
}
.settings-page-footer .btn {
	margin-left: 10px;
}
.report-box-activity-summery .report-box-single-line {
	justify-content: space-between;
}
.report-box-activity-summery .report-box-single-line > div {
	width: 100%;
}
.report-box-ac1 {
	display: flex;
	align-items: center;
	border-right: 1px solid #DEDEDE;
	padding: 0 30px;
}
.report-box-ac2 {
	display: flex;
	align-items: center;
	border-right: 1px solid #DEDEDE;
	padding: 10px 30px;
	max-width: 168px;
}
.report-box-ac3, .report-box-ac4, .report-box-ac5 {
	display: flex;
	align-items: center;
	border-right: 1px solid #DEDEDE;
	padding: 10px 20px;
}
.report-box-ac5 {
	border-right: none;
}
.report-box-activity-summery .report-box-title {
	border: none;
	padding: 10px;
	text-align: d;
	display: flex;
	align-items: center;
	justify-content: center;
}
.report-box-activity-summery .report-box-ac1.report-box-title {
	display: flex;
	align-items: center;
	padding: 10px 30px;
	justify-content: flex-start;
	padding-right: 10px;
}
.report-box-activity-summery .report-box-ht2-hour span {
	width: 50px;
}
.report-box-ac-hour-fill {
	width: calc(100% - 50px);
}
.report-box-activity-summery-header .report-box-title.report-box-title-right {
	justify-content: flex-end;
}
.report-box-tl-header-left {
    width: 60%;
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.report-box-tl-header-right {
    width: 40%;
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.report-box-tl-line-left {
    display: flex;
    width: 60%;
    justify-content: space-between;
}
.tl-box {
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 0;
	border-right: 1px solid #DEDEDE;
}
.report-box-tl-header-left .tl-box {
	border: none;
}
.tl-box1 {
	width: calc(100% - 360px);
	justify-content: flex-start;
	padding: 0 30px;
}
.tl-box2, .tl-box3, .tl-box4 {
	width: 120px;
}
.report-box-single-line button {
	outline: none;
	cursor: auto;
	width: 100%;
	height: 100%;
	font-size: 15px;
	font-weight: 600;
	position: relative;
	overflow: hidden;
}
.report-box-tl-line-right {
    width: 40%;
    display: flex;
    align-items: center;
}
.report-box-single-line button::after {
	content: '';
	width: 35px;
	height: 15px;
	background-color: #1FEF40;
	position: absolute;
	right: -9px;
	bottom: -10px;
	transform: rotate(139deg);
}
.report-box-waWeb1 {
	width: 20%;
	display: flex;
	align-items: center;
	border-right: 1px solid #DEDEDE;
	padding: 0 10px;
}
.report-box-waWeb2 {
	width: 80%;
	display: flex;
	align-items: center;
	padding: 10px 10px;
}
.report-box-waWeb2-name {
	display: flex;
	align-items: center;
	justify-content: space-between;
}
.report-box-waWeb2-name span {
	width: calc(100% - 25px);
	font-size: 12px;
	line-height: 15px;
	overflow: hidden;
}
.report-box-waWeb-name span {
	width: calc(100% - 30px);
	font-size: 13px;
	overflow: hidden;
	text-transform: capitalize;
}
.report-box-ht1-name.report-box-waWeb-name .avater {
	width: 20px;
	height: 20px;
	border-radius: 0;
	margin-right: 3px;
	margin-left: 0;
	background-size: contain;
}
.report-box-waWeb1.report-box-ht1-name.report-box-waWeb-name {
	padding: 0 10px;
}
.report-box-waWeb2.report-box-waWeb2-name {
	padding: 5px 15px;
}
.tl-box5 {
    width: 50%;
    padding: 10px 30px;
    border-right: 0;
    height: 100%;
}
.tl-box6 {
    width: 50%;
}
.timeline-time {
	max-width: 244px;
	display: flex;
	align-items: flex-end;
	justify-content: center;
	font-size: 10px;
	color: #B8BACE;
	margin: 0 auto;
	height: 39px;
}
.timeline-time-single {
	width: 4.166%;
	position: relative;
	display: flex;
	align-items: flex-end;
	height: 100%;
	background-color: #fff;
	border-left: 1px solid #efefef;
}
.timeline-time-single label {
	background-color: #00F356;
	width: 100%;
}
.timeline-time-single span {
    position: absolute;
    background-color: #fff;
    font-size: 14px;
    padding: 7px 8px;
    bottom: 0;
    right: 8px;
    color: #000;
    display: none;
    z-index: 9;
    width: 93px;
    text-align: center;
}
.timeline-time-single:hover span {
	display: block;
}
.timeline-time-single:hover {
	border: 1px solid #1C4396;
}
.timeline-time-single span:hover {
    display: none;
}
.timeline-area {
    width: 100%;
    height: 100%;
    padding: 0 30px;
    background-color: #E9FFF0;
    /*overflow: hidden;*/
}
.report-box-activity-summery-header {		
	justify-content: space-between;
	align-items: center;
}
.dashboard-sidebar-logo {
	border-bottom: 1px solid #DEDEDE;
	width: calc(100% + 35px);
	height: 60px;
	display: flex;
	align-items: center;
	margin-left: -35px;
	margin-top: -30px;
	padding-left: 15px;
	margin-bottom: 21px;
}
.dashboard-sidebar-logo img {
	max-width: 150px;
}
.report-box-tl-line-right .tl-box.tl-box6 {
	padding: 0;
	height: 100%;
}
.tl-sc-area {
	width: 100%;
	height: 100%;
	display: flex;
	align-items: center;
}
.tl-sc-link {
	width: 24px;
	height: 100%;
	background-color: #EDEEF2;
	display: flex;
	align-items: center;
	justify-content: center;
}
.tl-sc-items {
	width: calc(100% - 24px);
	display: flex;
	align-items: center;
	height: 100%;
	justify-content: space-between;
	padding: 4px 4px;
}
.tl-sc-item {
	width: calc(20% - 3px);
	height: 100%;
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center;
}
.report-box-wa1 {
	width: 45%;
}
.report-box-wa2 {
	width: 15%;
}
.report-box-wa3 {
	width: 30%;
}
.report-box-wa4 {
	width: 30%;
}
.report-box-web-app .report-box-single-line > div {
	display: flex;
	align-items: center;
	border-right: 1px solid #DEDEDE;
	padding: 0 30px;
}
.report-box-web-app .report-box-title, .report-box-wa4 {
	border-right: 0 !important;
}
.report-box-web-app .fill-line {
	width: 185px;
	margin-left: 20px;
}
.report-box-tl-line-right .tl-box.tl-box5 {
	padding: 0 4px 2px 0;
}
.screen-cast .dashboard-content, .download .dashboard-content {
	margin-left: 0;
}
.report-box-web-app .report-box-wa4 .fill-line span {
	background-color: #FA721B;
}
.web-app-fill {
	display: flex;
	align-items: center;
	justify-content: flex-start;
}
.fill-line span.fill-app {
	background-color: #FA721B;
}
.web-app-fill span {
	position: relative;
}
.report-box-title-sign-single .app-usage-color {
	background-color: #FA721B;
}
.report-box-title-sign-single span {
	display: inline-block;
	width: 10px;
	height: 10px;
	background-color: #1FEF40;
	border-radius: 50%;
}
.report-box-title-sign-single:last-child {
	font-size: 14px;
	margin-left: 20px;
}
.screen-cast .dashboard-sidebar, .download .dashboard-sidebar {
	left: -425px;
}
.screen-cast .header-ham, .download .header-ham {
	display: none;
}
.report-summery-area {
	position: fixed;
	top: 44px;
	right: -1200px;
	width: 1050px;
	height: 100%;
	background-color: #fff;
	box-shadow: -6px 20px 20px 20px rgba(228, 228, 228, 0.25);
	z-index: 99;
	overflow-y: auto;
	padding-bottom: 59px;
	transition: all .5s;
	overflow: hidden;
	height: calc(100vh - 44px);
}
.report-summery-area.active {
	right: 0;
}
.report-summery-header {
	background-color: #F9F9F9;
	padding: 40px 30px 30px;
}
.report-summery-header-top {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-bottom: 40px;
}
.report-summery-header-profile {
	width: calc(100% - 27px);
	display: flex;
	align-items: center;
	font-size: 18px;
	color: #000000;
	font-weight: 600;
}
.report-summery-header {
	background-color: #F9F9F9;
	padding: 40px 30px 30px;
}
.report-summery-header-profile .avater {
	margin-right: 10px;
	width: 30px;
	height: 30px;
}
.report-summery-header-bottom {
	padding-bottom: 30px;
	display: flex;
	flex-flow: row wrap;
}
.report-summery-header-box {
	width: 201px;
	height: 113px;
	background-color: #fff;
	margin-right: 10px;
	padding: 20px;
	transition: all .3s;
}
.report-summery-header-box:hover {
	background-color: #EFF4FF;
}
.report-summery-header-box h5 {
	font-size: 15px;
	font-weight: 600;
	color: #1C4396;
	margin-bottom: 13px;
}
.report-summery-header-box-hr {
	display: flex;
	align-items: center;
	justify-content: space-between;
	color: #171717;
	font-size: 15px;
	font-weight: 600;
	margin-bottom: 12px;
}
.report-summery-tabs-item .report-box-single-line {
	border-left: 0;
}
.report-summery-tabs-item .avater {
	margin-left: -4px;
}
.report-summery-tabs-menu {
	padding: 15px 10px;
}
.report-summery-tabs-menu ul {
	font-size: ;
	display: flex;
	align-items: center;
}
.report-summery-tabs-menu ul li {
	margin-right: 27px;
}
.report-summery-tabs-menu ul li a {
	font-size: 17px;
	line-height: 20px;
	color: #B8BACE;
	font-weight: 600;
}
.report-summery-tabs-menu ul li a:hover, .report-summery-tabs-menu ul li.active a {
	color: #1C4396;
}
.report-summery-tabs-items .sc-boxs::before {
	display: none;
}
.report-summery-tabs-item {
	display: none;
}
.report-summery-tabs-item.active {
	display: block;
}
.report-summery-tabs {
	height: calc(100% - 283px);
	overflow-y: auto;
}

/*.report-box-ht1-name {
	cursor: pointer;
}*/
.loader {
	position: relative;
}
.loader::before {
	content: '';
	width: 100%;
	height: 100%;
	position: fixed;
	top: 44px;
	left: 0;
	background-color: #00000040;
	z-index: 9999;
	background-image: url(/images/loader.gif);
	background-repeat: no-repeat;
	background-size: auto;
	background-position: center;
	display: none;
}
.dashboard-sidebar-menu {
	display: none;
	margin-bottom: 20px;
	border-bottom: 1px solid #DEDEDE;
	padding-bottom: 10px;
}
.dashboard-sidebar-menu ul li a {
	width: 100%;
	display: block;
	padding: 10px;
	font-weight: 600;
}

/*pooper*/
.pooper-overlay {
	position: fixed;
	width: 100%;
	height: 100%;
	top: 0;
	left: -100px;
	z-index: 99;
	display: none;
}

/*download box*/
.download-boxx-area .sc-header-title::after {
	display: none;
	border-right: 0;
}
.slider-download-box {
	max-width: 650px;
	padding: 33px 39px 19px;
	background-color: #F9FBFF;
	text-align: center;
	margin: 20px auto 30px;
	font-family: 'Nunito Sans', sans-serif;
	color: #1C4396;
}
.slider-download-box > img {
	margin-bottom: 18px;
}
.download-select-box {
	background-color: #FFFFFF;
	border: 1px solid #DFE9FF;
	padding: 10px 23px 11px;
	background-color: #F9FBFF;
}
.download-select-box p {
	font-size: 18px;
	line-height: 24px;
	margin-bottom: 25px;
	padding-bottom: 14px;
	border-bottom: 1px solid #DFE9FF;
	margin-top: 6px;
}
.slider-download-single {
	max-width: 357px;
	margin: 0 auto;
	display: flex;
	align-items: center;
	background-color: #9BB8FA;
	justify-content: center;
	height: 65px;
	font-size: 22px;
	font-family: 'MarselisPro';
	font-weight: 600;
	border-radius: 50px;
	color: #1C4396;
	margin-bottom: 18px;
}
.slider-download-single:hover {
	color: #1C4396;
}
.slider-download-single img {
	width: 30px;
	margin-right: 14px;
}
.comming-soon {
	font-size: 14px;
}
.download-select-btn {
	margin-top: 20px;
}
.slider-download-single div {
	display: flex;
	flex-direction: column;
	line-height: 19px;
}
.slider-download-single.comming-soon-a {
	cursor: auto;
}

.dashboard-content .modal-mask {
	display: flex;
	align-items: center;
	justify-content: center;
}
.dashboard-content .modal-mask .modal-container {
	margin: 0 10px;
	padding: 0;
	width: auto;
	background-color: transparent;
	border-radius: 0;
	box-shadow: none;
	font-family: inherit;
	max-width: calc(100% - 20px);
}
.popup-module-global-body .modal-task-editor > span {
	display: block;
	font-size: 12px;
	margin-top: 5px;
}
.modal-task-editor input {
	width: 350px;
	height: 32px;
	border: 1px solid #ddd;
	border-radius: 5px;
	font-size: 12px;
	line-height: 30px;
	outline: 0;
	padding: 0 8px;
	cursor: text;
	font-weight: 600;
	max-width: 100%;
}
.dashboard-content .modal-mask .popup-module-global-body {
	padding-bottom: 21px;
}
.dashboard-content .modal-mask .popup-module-global {
	width: auto;
}
.popup-module-global-body .modal-task-editor:not(:first-child) {
	margin-top: 10px;
}


/*today v2*/
.today-list-body {
	display: flex;
	justify-content: space-between;
	padding: 7px 0;
}
.today-list-body-left h4 {
	font-size: 14px;
	color: #1C4396;
	font-weight: 700;
	margin-bottom: 2px;
}
.today-list-body-left-content {
	color: grey;
	font-size: 13px;
}
.today-list-body-left-content .bold-color {
	font-weight: 600;
}
.today-list-body-left-content .seperat {
	color: #1C4396;
	font-weight: 700;
	display: inline-block;
	margin: 0 2px;
}
.today-list-body-right {
	width: 260px;
	display: flex;
	flex-direction: column;
	align-items: flex-end;
}
.today-list-body-left {
	width: calc(100% - 260px);
}
.today-list-body-right-name {
	display: flex;
	align-items: center;
	justify-content: flex-end;
	width: 100%;
}
.today-list-body-right-name span {
	max-width: calc(100% - 24px);
	font-weight: 700;
	color: #333;
}
.today-list-body-right-name svg {
	color: gray;
}
.today-list-body-right-time {
	font-size: 12px;
	color: grey;
}
.wa-name-arrow-link {
	width: 17px;
	margin-left: 20px;
}
.report-summery-tabs-item .wa-name-arrow-link {
	width: 12px;
}
.wa-name-title {
	width: calc(100% - 20px);
	display: flex;
	align-items: center;
}
.wa-name-title-area {
	cursor: pointer;
}
.report-summery-tabs-item .report-box-ht2-hour span {
	width: auto;
	margin-right: 5px;
}
.has-tooltip {
	position: relative;
}
.tooltip {
	position: absolute;
	background-color: #333;
	font-size: 12px;
	padding: 4px 14px;
	color: #fff;
	font-weight: 500;
	border-radius: 3px;
	top: calc(100% + 8px);
	left: -65%;
	display: none;
	z-index: 99;
}
.has-tooltip:hover .tooltip {
	display: block;
}
.tooltip::before {
	content: '';
	width: 8px;
	height: 10px;
	background-color: #333;
	position: absolute;
	top: -5px;
	transform: rotate(45deg);
	left: calc(50% - 5px);
}
.sidebar-expansion-exp-trigger .tooltip {
	left: -58px;
	width: 77px;
}
.sidebar-expansion-exp-trigger .tooltip::before {
	left: 78%;
}
.board-section-item-meta-menu-add .tooltip {
	left: -16px;
	top: 23px;
	width: 51px;
	text-align: center;
	padding: 4px 6px;
}
/*.board-section-item-meta-menu-add .tooltip::before {
	left: 93%;
	top: 7px;
}*/


/*task option popup*/
.dashboard-content .task-popup-area-container .modal-container {
	/*height: calc(100% - 100px);*/
	background-color: #fff;
	/* box-shadow: 0 2px 8px 0 rgba(0,0,0,.16); */
	border-radius: 10px;
	margin: 0;
	width: 650px;
}
.task-popup-area {
	width: 100%;
	height: 100%;
	padding: 20px 24px;
}
.task-options-header {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	margin-bottom: 10px;
}
.task-opts-close {
	width: 24px;
	margin-top: -8px;
}
.task-opts-project-name {
	width: calc(100% - 50px);
	display: flex;
	align-items: center;
}
.task-opts-project-name .icon {
	width: 16px;
}
.task-opts-project-name span {
	width: calc(100% - 16px);
	padding-left: 3px;
	font-size: 12px;
	line-height: 18px;
	margin-top: -4px;
	color: #202020;
}
.task-options-dec-textarea {
	transition-property: box-shadow,border;
	transition-duration: .3s;
	transition-timing-function: ease;
	border: none;
	margin: 8px 0 0;
	width: 100%;
	font-size: 13px;
	line-height: 18px;
	outline: none;
	resize: none;
	padding: 0 8px;
	user-select: text;
	font-family: -apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol;
	height: 38px;
	overflow-x: hidden;
	overflow-y: auto;
}
.projects-piller-assign .task-assign-avatar {
	margin-right: 4px;
}
.task-editor-editing-area .projects-piller-assign.icon-piller:hover {
	color: #555;
}
.task-options-editor .task-editor-actions {
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-wrap: wrap;
}
.task-options-tabs {
	padding-top: 6px;
	border-top: 1px solid #ddd;
	margin-top: 32px;
	height: calc(100% - 236px);
}
.task-options-tabs-menu ul {
	display: flex;
	align-items: center;
	justify-content: ;
}
.task-options-tabs-menu ul li {
	width: 50%;
	display: ;
	text-align: center;
}
.task-options-tabs-menu ul li a {
	font-size: 13px;
	line-height: 1em;
	padding: 9px 0;
	color: grey;
	border-bottom: 1px solid #e0e0e0;
	width: 100%;
	display: block;
}
.task-options-tabs-menu ul li a:hover {
	color: #202020;
}
.task-options-tabs-menu {
	margin-bottom: 10px;
}
.task-options-tabs-menu .active a {
	font-weight: 700;
	border-bottom: 1px solid #202020;
	color: #202020;
}
.task-options-tabs-body {
	height: calc(100% - 47px);
}
.task-options-tabs-sub-task {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
}
.task-options-tabs-item, .task-options-tabs-sub-task {
	height: 100%;
}
.task-options-tabs-sub-task .list-holder {
	min-height: 82px;
	overflow-x: hidden;
	overflow-y: auto;
}
@media only screen and (max-width: 991px) {
	.dashboard-content .task-popup-area-container .modal-container {
		width: 100%;
		overflow-y: auto;
		height: calc(100% - 66px);
		margin-top: 38px;
	}
	.task-popup-area {
		height: auto;
	}
}


.notification-page-list {
	padding-bottom: 50px;
}
.np-list-single {
	display: flex;
	align-items: center;
	padding: 13px 0 13px;
	border-top: 1px solid #f0f0f0;
}
.np-list-icon {
	width: 46px;
	height: 46px;
	background-color: #1C439617;
	padding: 12px;
	border-radius: 50%;
	margin-right: 14px;
}
.np-list-actions {
	width: 24px;
	margin-left: 16px;
}
.np-list-content {
	width: calc(100% - 80px);
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	min-height: 40px;
}
.np-list-content p {
	font-size: 13px;
	font-weight: 500;
	margin: 0;
	margin-bottom: 10px;
}
.np-list-content span {
	font-size: 12px;
	color: gray;
	font-weight: 500;
}
.no-data-area {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	padding-top: 77px;
}
.no-data-area img {
	max-width: 294px;
	margin-bottom: 11px;
}
.no-data-area h4 {
	font-size: 16px;
	text-transform: capitalize;
	color: #1C4396;
}
.no-data-area button {
	margin-top: 16px;
}
.dashboard-content-board-small-clients .section-list > li {
	padding-bottom: 0;
	margin-bottom: 0;
}
.dashboard-content-board-small-clients .section-head-title small {
	margin-left: 0;
}
.np-list-single.no-data-area img {
	max-width: 227px;
}
.nd-list-singleno-data {
	display: flex;
	align-items: center;
	flex-direction: column;
	justify-content: center;
	height: 100%;
}
.nd-list-singleno-data img {
	max-width: 79px;
	margin-bottom: 2px;
}
.nd-list-singleno-data h4 {
	font-size: 16px;
	text-transform: capitalize;
	color: #1C4396;
}


@media only screen and (max-width: 1700px) {
	.slider-download-box {
		padding: 25px 39px 25px;
		margin: 15px auto 10px;
	}
	.slider-download-box > img {
		margin-bottom: 23px;
	}
	.download-select-box {
		padding-top: 0;
		padding-bottom: 5px;
	}
	.download-select-box p {
		font-size: 20px;
		line-height: 17px;
		margin-bottom: 23px;
		padding-bottom: 17px;
		border-bottom: 1px solid #DFE9FF;
	}
	.report-summery-header-top {
		margin-bottom: 12px;
	}
	.report-summery-header {
		background-color: #F9F9F9;
		padding: 20px 30px 5px;
	}
	.report-summery-tabs {
		height: calc(100% - 210px);
	}
}
@media only screen and (max-width: 991px) {
	.slider-download-box {
		margin: 0 auto;
		padding: 30px 0;
	}
}
/*Responsive*/
@media only screen and (max-width: 1100px) {
	.download-select-box {
		width: 100%;
	}
	.report-summery-tabs {
		height: auto;
	}
	.report-summery-area {
		overflow-y: auto;
	}
}
@media only screen and (max-width: 991px) {
	.header-menu, .header-search {
		display: none;
	}
	.dashboard-header {
		padding: 0 12px;
		position: relative;
		z-index: 9999;
	}
	.dashboard-content {
		margin-left: 0;
	}
	.dashboard-content-board, .dashboard-content-inner {
		background-color: #fff;
	}
	.sidebar-overlay.sidebar-overlay-active {
		width: 100%;
		position: fixed;
		top: 0;
		left: 0;
		height: 100%;
		background-color: rgba(0,0,0,.5);
		z-index: 999;
		transition: all .3s;
	}
	.dashboard-sidebar {
		left: -255px;
		padding-top: 10px;
		padding-left: 10px;
	}
	.dashboard-sidebar.sidebar-active {
		top: 44px;
		left: 0;
	}
	.dashboard-content-header, .content-board-inner, .content-board-inner-small, .upcoming-view-calendar, .sc-header-top, .sc-wrapper, .report-box-area, .report-box-ht2, .report-box-ht1 {
		padding-left: 15px;
		padding-right: 15px;
	}
	.settings-area {
		margin-left: 0;
	}
	.settings-items {
		background-color: #fff;
		position: relative;
	}
	.sc-header {
		position: inherit;
	}
	.sc-header-top-left {
		width: 100%;
		margin-bottom: 10px;
	}
	.sc-header-top {
		flex-wrap: wrap;
		padding: 25px 15px;
		height: auto;
	}
	.sc-header-top-right {
		width: 100%;
		justify-content: flex-start;
		padding-top: 7px;
	}
	.sc-header-title::after {
		display: none;
	}
	.report-area {
		background-color: #fff;
		position: relative;
	}
	.report-box-activity-summery .report-box-single-line {
		flex-wrap: wrap;
		padding-top: 10px;
		padding-bottom: 10px;
	}
	.report-box-activity-summery .report-box-ac1.report-box-title {
		padding-left: 13px;
	}
	.report-box-activity-summery .report-box-title {
		justify-content: flex-start;
	}

	.report-box-activity-summery .report-box-single-line > div {
		padding-left: 15px;
		border-right: none;
	}
	.report-box-timeline .report-box-single-line {
		flex-wrap: wrap;
		padding: 14px 0;
	}
	.report-box-activity-summery-header .report-box-title.report-box-title-right {
		justify-content: flex-start;
	}
	.report-box-tl-header-left, .report-box-tl-header-right, .report-box-tl-line-left, .report-box-tl-line-right {
		flex-wrap: wrap;
		width: 100%;
		justify-content: flex-start;
	}
	.tl-box {
		width: 100%;
	}
	.report-box-tl-header-left .tl-box, .report-box-tl-header-right .tl-box {
		justify-content: flex-start;
		padding: 5px 10px;
	}
	.report-box-tl-header-right {
		margin-bottom: 15px;
	}
	.report-box-tl-line-left, .report-box-tl-line-right {
		width: 100%;
	}
	.report-box-tl-line-left .tl-box, .report-box-tl-line-right .tl-box {
		border: none;
		width: 100%;
		justify-content: flex-start;
		padding: 7px 10px;
	}
	.report-box-single-line .report-box-tl-line-left button {
		max-2: ;
		max-width: 91px;
		height: 40px;
	}
	.screen-cast .dashboard-sidebar.sidebar-active, .download .dashboard-sidebar.sidebar-active {
		left: 0;
	}
	.screenshot-area {
		position: relative;
		background-color: #fff;
	}
	.screen-cast .header-ham, .download .header-ham {
		display: flex;
	}
	.report-summery-area {
		width: 100%;
	}
	.report-summery-header-box {
		width: 100%;
		margin-right: 0;
		margin-bottom: 20px;
	}
	.report-summery-header {
		padding: 29px 15px 30px;
	}
	.dashboard-sidebar-logo, .header-logo-wrap {
		display: none;
	}
	.notification-has-number:hover .notification-dropdown {
		display: none;
	}
	.dashboard-sidebar-menu {
		display: block;
	}
	.popup-module-global {
		width: calc(100% - 30px);
		left: 15px;
		top: 112px;
	}
	.settings-page-footer {
		padding-right: 10px;
	}
	.today-list-body {
		flex-wrap: wrap;
	}
	.today-list-body-left {
		width: 100%;
		margin-bottom: 2px;
	}
	.today-list-body-right {
		width: 100%;
		align-items: flex-end;
	}
	.today-list-body-right-name {
		justify-content: flex-start;
		margin-left: -5px;
	}
	.report-summery-tabs-item .report-box-single-line {
		flex-wrap: wrap;
		padding: 10px 0;
	}
	.report-box-waWeb1 {
		margin-bottom: 7px;
	}
	.report-box-waWeb1, .report-box-waWeb2 {
		width: 100%;
	}
	.content-header-title-edit {
		flex-direction: column;
	}
	.content-header-title-edit-opts {
		margin-left: 0;
		margin-bottom: 0;
		margin-top: 10px;
	}
	.settings-company .settings-single {
		flex-wrap: wrap;
	}
	.settings-single .settings-single-item {
		width: 100%;
	}
}



@media only screen and (max-width: 500px) {
	.sc-header-top-right, .report-box-single-line {
		flex-wrap: wrap;
	}
	.sc-header-top-right > div {
		margin--b: ;
		margin-bottom: 15px;
	}
	.sc-header-top {
		padding-bottom: 10px;
	}
	.sc-single-box {
		width: 100%;
		margin-right: 0;
	}
	.sc-boxs {
		padding-left: 15px;
	}
	.report-box-ht1, .report-box-ht2 {
		width: 100%;
		padding: 5px 15px;
	}
	.report-box-ht1 {
		border: none;
	}
	.report-box-ht1.report-box-title, .report-box-ht2.report-box-title .report-box-title-left {
		display: none;
	}
	.report-box-title-right a {
		margin-left: 0;
		margin-right: 15px;
	}
	.report-box-single-line {
		padding-top: 10px;
		padding-bottom: 10px;
	}
}

@media only screen and (max-width: 450px) {
	.slider-download-single-content img {
		width: 19px;
		margin-right: 5px;
	}
	.slider-download-single-content {
		font-size: 17px;
	}
	.slider-download-single .btn {
		width: 149px;
		font-size: 16px;
		height: 39px;
	}
	.slider-download-single {
		flex-wrap: wrap;
	}
}