/*************************/
/* LAYOUT                */
/*************************/

.teams-bar { width: 16%; float: left; font-size: 0.9em !important; }
.boards-bar { width: 55%; float: left;}
.center-content { width: 29%; float: left; }
.teams-bar .org-logo { padding: 10% !important }
.modal-width-large { width: 98%; }
.modal-width-medium { width: 95%; }
.modal-width-small { width: 90%; }

@media (min-width: 768px) {
    .teams-bar { width: 6%; font-size: .75em !important; }
    .boards-bar { width: 25%; font-size: .85em !important; }
    .center-content { width: 69%; font-size: .85em !important; }
	.modal-width-large { width: 90%; }
	.modal-width-medium { width: 70%; }
	.modal-width-small { width: 60%; }
    .med-display-flex { display: flex; }
}
@media (min-width: 992px) {
    .teams-bar { width: 5%; font-size: .75em !important; }
    .boards-bar { width: 18%; font-size: .85em !important; }
    .center-content { width: 77%; font-size: .85em !important; }
	.modal-width-large { width: 90%; }
	.modal-width-medium { width: 80%; }
	.modal-width-small { width: 50%; }
    .col-md-3.issue-phase-list { width: 20%; }
    .col-md-9.issue-center-content { width: 80%; }
}
@media (min-width: 1200px) {
    .teams-bar { width: 4%; font-size: .75em !important;}
    .boards-bar { width: 16%; font-size: .95em !important;}
    .center-content { width: 80%; font-size: .95em !important;}
	.modal-width-large { width: 75%; max-width: 1024px; }
	.modal-width-medium { width: 60%; }
	.modal-width-small { width: 40%; }
}
@media (min-width: 1600px) {
    .teams-bar { width: 4%; }
    .boards-bar { width: 14%; }
    .center-content { width: 82%; }
	.modal-width-large { width: 70%; max-width: 1024px; }
	.modal-width-medium { width: 50%; }
	.modal-width-small { width: 30%; }
}
@media (min-width: 2500px) {
    .teams-bar { width: 3%; }
    .boards-bar { width: 11%; }
    .center-content { width: 84%; }
	.modal-width-large { width: 60%; max-width: 1024px; }
	.modal-width-medium { width: 40%; }
	.modal-width-small { width: 20%; }
}




/*************************/
/* XXL MODAL           */
/*************************/
.xxl-modal-dialog {
    /* width: 70%; */
    margin: 0px auto;
    margin-right: 0px;
    height: 100%;
    overflow: auto;
}



/*@media only screen and (max-width: 768px) {
.xxl-modal-dialog {
    width: 100%;
}
} */


.xxl-modal-content {
	height: 100%; 
	border-radius: 0;
}

.xxl-modal-content .modal-header {
   /* background: #f48fb1;
    padding: 10px 10px 10px 15px;
    background: #262f3d !important; */
	color: black;
	font-size: 1.4em;
	position: sticky;
	top: 0;
	z-index: 1000;
	border: none;
}


.xxl-modal-content .modal-title {
    font-weight: 400;
    font-size: 1.4em;
    letter-spacing: .4px;
    /*color: #29b6f6;  */
}

.modal-body {
	padding: 0px 15px;
}
.modal-footer { border: 0px; }
.modal-header { border: 0px; }

.modal-backdrop.in {
	/*opacity: 0.7;*/
}

.modal-close-icon {
	position: absolute;
	top: 0;
	right: 0px;
	z-index: 1000;
	padding: 5px 0px 0px 0px;
}	
.middle-modal .modal-close-icon {
    top: 10px;
    right: 28px;
    transition: opacity .3s;
}
.middle-modal .modal-close-icon:hover {
    opacity: 0.5;
}

/*************************/
/* JQ VALIDATE ERROR MSGS*/
/*************************/
.error {
	background: lightpink;
}

label.error {
	font-style: italic;
	color: crimson;
	margin: 10px 0px;
	background: none;
}

/***********************/
/* COMMON ELEMENTS     */
/***********************/
.select2 {
    width: 100% !important;
}

select.tags-select {
    border: none;
    border-bottom: 1px solid lightgrey;
}

.select2-container--default .select2-selection--single {
    border: none;
    border-bottom: 1px solid lightgrey;
    background: inherit;
}

.select2-container--default .select2-results__group {
    font-weight: 600;
    color: black;
    font-size: 1.2em;
}

.lead {
	font-size: 1.2em;
	font-weight: 400;
	color: #29b6f6;
}

.xlead {
	font-size: 1.4em;
	font-weight: 400;
	color: #29b6f6;
}

.xxlead {
	font-size: 2em;
	font-weight: 400;
	color: #29b6f6;
}


.lead-input{
    font-weight: 600;
    font-size: 1.4em;
    padding: 25px 0px;
}

.large { font-size: 1.2em !important; }
.xlarge { font-size: 1.3em !important; }
.xxlarge { font-size: 1.5em !important; }
.xxxlarge { font-size: 1.8em !important; }
.xxxxlarge { font-size: 2em !important; }
.xxxxxlarge { font-size: 3em !important; }

.medium { font-size: 1em; }

.small { font-size: 0.95em; }
.msmall { font-size: 0.85em; }
.xsmall { font-size: 0.75em; }
.xmsmall { font-size: 0.60em; }
.xxsmall { font-size: 0.4em; }
.xxxsmall { font-size: 0.25em; } 

.jumbotron { background: white; }

.full-opacity { opacity: 1; }
.low-opacity { opacity: 0.8; }
.med-opacity { opacity: 0.5; }
.high-opacity { opacity: 0.3; }


.small-line-height { line-height: 0.8; }
.med-line-height { line-height: 1; }
.large-line-height { line-height: 2; }
.xlarge-line-height { line-height: 2.5; }


/***********************/
/* GENERAL Classes   */
/***********************/
.center-content {
	min-height:650px;
}

#main-content {
	opacity: 1;
}

#main-content:hover {
	opacity: 1;
}

.center-element {
	margin:0px auto;
}

.full-width { width: 100%; }
.width-80 { width: 80%; }
.width-70 { width: 70%; }
.width-50 { width: 50% !important; }
.width-30 { width: 30% !important; }
.width-10 { width: 10% !important; }
.inherit-width { width: inherit; }

.full-height { height: 100%; }

body {
    background: #ecf0f1;
    font-family: 'Roboto', sans-serif;
    font-size: 12px;
    color: #34495e;
}

h1, h2, h3, h4, h5, h6 {
    font-family: 'Roboto', sans-serif;
	font-weight: 400;
	letter-spacing: 0em;
}
h1 {
	font-size: 2em;
}

h2 {
    font-size: 1.5em;
}

.font-awesome {
	font-family: 'FontAwesome','Source Sans Pro', sans-serif; 
}


h5 {
	margin: 0px 0px 10px 0px;
}


.no-border {
	border: 0px !important;
}

.center-div {
	margin: 0px auto;
}


.fixed-bottom {
	position: fixed;
	bottom: 0;
}
.relative{
	position: relative;
}
.sticky-top {
    position: sticky;
    left: 0;
}

h5 a:hover {
	opacity: 0.7;
	text-decoration: none;
}



strong,bold,.bold { font-weight: 400; }
.extra-extra-bold {font-weight: 700}
.extra-bold { font-weight: 600; }
.xbold {font-weight: 500}
.light { font-weight: 400; }
.italics { font-style: italic; }

.uppercase { text-transform: uppercase; }
.titlecase { text-transform: capitalize; }
.lowercase { text-transform: lowercase; }

a {
	color: #29b6f6;
	text-decoration: none !important;
}

a:hover {
	opacity: 0.7;
	text-decoration: none !important;
}


.clickable-pointer {
	cursor: pointer;
}

.clear {
	clear: both;
}


/***********************/
/* FOOTER Classes   */
/***********************/
.footer {
	font-size: .8em;
	/* margin-top: 50px; */
	margin-bottom: 0px;
	background: #455a64;
	color: #cfd8dc;
	padding:10px 5px;
	text-align: center;	
}

/***********************/
/* ALIGNMENT Classes   */
/***********************/
.center {
	text-align:center !important ;
}

.center td {
	text-align: center !important;
}

.align-middle {
	vertical-align:middle !important;
}

.align-top {
	vertical-align:top !important;
}

.align-bottom {
	vertical-align:bottom !important;
}

.align-bottom2 {
	vertical-align:-moz-middle-with-baseline;
}

.right {
	text-align:right;
}

.left {
	text-align: left;
}


.overflow-x-hidden { overflow-x: hidden; }
.overflow-y-hidden { overflow-y: hidden; }
.overflow-x-auto { overflow-x: auto; }
.overflow-y-auto { overflow-y: auto; }


/***********************/
/* DISPLAY Classes     */
/***********************/
.inline-block { display: inline-block; }
.inline-block1 { display: inline-block; }
.flex-block {display: flex;}
.flex-inline {display: inline-flex;}
.grid-block {display: grid;}
.item-center{align-items: center;}
.justify-center{justify-content: center;}
.justify-between{justify-content: space-between;}
.flex-column {flex-direction: column;}
.width-fill-available{
	width: -webkit-fill-available;
}

/***********************/
/* Flex Gap Classes    */
/***********************/
.small-gap{
	gap: 5px;
}
.med-gap{
	gap: 10px;
}
.large-gap{
	gap: 20px;
}

.hide-block { display:none; }
.show-block { display:block; }

a.disabled,
.disabled {
	color:lightgrey;
}

a.disabled:hover,
.disabled:hover {
	color:lightgrey;
}


/***********************/
/* PADDING Classes     */
/***********************/
.no-padding { padding:0px; }
.xsmall-padding { padding:2px; }
.small-padding { padding:5px; }
.msmall-padding { padding:7px; }
.med-padding { padding:10px !important; }
.large-padding { padding:20px !important; }
.xlarge-padding { padding:50px; }

.xsmall-padding-right { padding-right: 2px; }
.xsmall-padding-left { padding-left: 2px; }
.xsmall-padding-top { padding-top: 2px !important; }
.xsmall-padding-bottom { padding-bottom: 2px !important; }

.small-padding-right { padding-right: 5px; }
.small-padding-left { padding-left: 5px !important; }
.small-padding-top { padding-top: 5px !important; }
.small-padding-bottom { padding-bottom: 5px !important; }


.msmall-padding-right { padding-right: 7px; }
.msmall-padding-left { padding-left: 7px; }
.msmall-padding-top { padding-top: 7px; }
.msmall-padding-bottom { padding-bottom: 7px; }



.med-padding-right { padding-right: 10px; }
.med-padding-left { padding-left: 10px; } 
.med-padding-top { padding-top: 10px !important; }
.med-padding-bottom { padding-bottom: 10px !important; }



.large-padding-top { padding-top: 20px !important; }
.large-padding-left { padding-left: 20px !important; }
.large-padding-bottom { padding-bottom: 20px !important; }
.large-padding-right { padding-right: 20px !important; }
.large-padding-right-per { padding-right: 10% !important; }

.xlarge-padding-top { padding-top: 30px !important; }
.xlarge-padding-left { padding-left: 30px !important; }
.xlarge-padding-bottom { padding-bottom: 30px !important; }
.xlarge-padding-right { padding-right: 30px !important; }


.xxlarge-padding-top { padding-top: 50px !important; }
.xxlarge-padding-left { padding-left: 50px !important; }
.xxlarge-padding-bottom { padding-bottom: 50px !important; }
.xxlarge-padding-right { padding-right: 50px !important; }


/***********************/
/* MARGIN Classes     */
/***********************/
.no-margin { margin:0px; }

.small-margin { margin:5px; }
.small-margin-left { margin-left:5px; }
.small-margin-right { margin-right:5px; }
.small-margin-top { margin-top:5px; }
.small-margin-bottom { margin-bottom:5px; }


.med-margin { margin:10px; }
.med-margin-bottom { margin-bottom:10px; }
.med-margin-top { margin-top: 10px; }
.med-margin-right { margin-right:10px; }
.med-margin-left { margin-left: 10px; }


.large-margin { margin:20px; }
.large-margin-bottom { margin-bottom:20px; }
.large-margin-top { margin-top: 20px; }
.large-margin-right { margin-right:20px; }
.large-margin-left { margin-left: 20px; }



.xlarge-margin { margin:50px; }
.xlarge-margin-top { margin-top:50px; }
.xlarge-margin-bottom { margin-bottom:50px; }
.xlarge-margin-right { margin-right:50px; }
.xlarge-margin-left { margin-left: 50px; }




/***********************/
/* TABLE Classes         */
/***********************/
.table>thead>tr>th {
    font-size: 14px;
    text-transform: uppercase;
}

.table {
	margin-bottom: 0px;
	background: white;
}

.not-active-row td, 
.not-active-row td a {
	color: darkgrey !important;
}
/* Fixing table alignment in issue modals */
.middle-modal .table-hover>tbody>tr:hover {
    background-color: transparent;
}
.middle-modal .table>tbody>tr>td:first-child {
    white-space: nowrap;
    padding-left: 0;
    padding-right: 16px;
}

/***********************/
/* FORM Classes         */
/***********************/

.form-primary-input {
	font-size: 22px;
    padding: 8px;
    padding-left: 0;
    margin-top: 4px;
    font-weight: bold;
    width: 400px;
}

.action-bar {
    /*background: #16a085;*/
    width: 100%;
    z-index: 1000;
    left: 0;
}

.input-group-addon-prefix {
	border: none;
	border-bottom: 1px solid lightgray;
	color: darkgray;
	border-radius: 20px 0px 0px 20px;
}

.input-group-addon-suffix {
	border: none;
	border-bottom: 1px solid lightgray;
	color: darkgray;
	border-radius: 0px 20px 20px 0px;
}



/***********************/
/* BOX Classes         */
/***********************/
.box {
	background: white;
	color: black;
	padding:15px;
	border: 1px solid grey;
}
.box-light {
	background: #f5f5f5;
	color: black;
	padding:15px;
}
.box-inverse {
	background: black;
	color: white;
	padding:15px;
}
.box-highlight {
	background: lightyellow;
	color: black;
	padding:15px;		
}
.box-add {
	border: 5px dashed lightgray;
	opacity: 0.5;
}

.z-index-1 { z-index: 1; }
.z-index-5 { z-index: 5; }
.z-index-100 { z-index: 100; }
.z-index-1200 { z-index: 1200; }


.box-shadow {
	box-shadow: 0 2px 2px 0 rgba(0,0,0,.14), 0 3px 1px -2px rgba(0,0,0,.2), 0 1px 5px 0 rgba(0,0,0,.12);
}
.no-box-shadow {
	box-shadow: none;
}

/***********************/
/* SEARCH BAR Classes  */
/***********************/
.search-highlight{
	background: lightyellow;
	font-weight: bold;
}

.clear-search {
	font-size:12px;
}

.search-bar .panel-info>.panel-heading {
    color: white;
    background-color: #64b5f6;
    border: none;
    padding: 0px 15px;
}
.search-bar .well {
	background: white;
	border: none;
}

/***********************/
/* AJAX Loader Classes */
/***********************/
#tmp-placeholder {
	display:none;
}

#loading {
	position: absolute;
	top: 0;
	left: 0;
	background: black;
	color: white;
	opacity: 0.7;
	width: 100%;
	height: 100%;
	padding-top: 20%;
	display: none;
}

/***********************/
/* Custom Label Classes*/
/***********************/
.custom-label-white {background: white; }
.custom-label-khaki {background: khaki;}
.custom-label-grey { background: grey;}
.custom-label-orange { background: orange;}
.custom-label-black { background: black;}
.custom-label-lightgrey { background: lightgrey;}
.custom-label-lightblue { background: lightblue;}
.custom-label-lightpink { background: lightpink;}
.custom-label-lightgreen { background: lightgreen;}
.custom-label-lightyellow {background: lightyellow;}
.custom-label-lightsalmon { background: lightsalmon;}
.custom-label-lightsteelblue { background: lightsteelblue;}

.custom-label-CRITICAL {background: #e57373; color: white;}
.custom-label-HIGH {background: #f8bbd0; color: black;}
.custom-label-MEDIUM {background: #ffcc80; color: grey;}
.custom-label-LOW {background: white; color: grey; border:1px solid lightgrey;}

.custom-label-INPROGRESS {background: #64b5f6; color: white;}
.custom-label-SCHEDULED {background: #cfd8dc; color: black;}
.custom-label-COMPLETED {background: lightgreen; color: black;}

/***********************/
/* BORDER Classes         */
/***********************/
.border-none { border: none;}
.border-all-light { border: 1px solid lightgrey;}
.border-all { border: 1px solid grey;}
.border-right { border:none; border-right: 1px solid grey;}
.border-left { border:none; border-left: 1px solid grey;}
.border-top { border:none; border-top: 1px solid grey;}
.border-top-light { border:none; border-top: 1px solid lightgrey;}
.border-bottom { border:none; border-bottom: 1px solid grey;}
.border-bottom-light { border:none; border-bottom: 1px solid lightgrey;}
.border-left-selected { border-left: 5px solid white } 

.bg-warning-h1 {background:#AAAA39;}
.bg-warning-h2 {background:#D4D46A	;}

.bg-info-h1 {background:#143054;}
.bg-info-h2 {background:rgba(33, 150, 243, 0.52)	;}


/* STANDARD BGs */
.bg-primary      {background:white !important; color: #78909c}
.bg-secondary1    {background-color: #F7FAFC !important;color: #78909c}

.color-primary      {color:#2980b9}
.color-secondary      {color:#78909c}







.bg-light-grey      {background:#ecf0f1 !important; color: #78909c}
.bg-light-bluegrey      {background:#eceff1 !important; color: white}
.bg-light-blue      {background:#19212b !important; color: #78909c}
.bg-light-blue      {background:#f9faff !important; color: #78909c}
.bg-light-grey2      {background:#fafafa !important; color: #78909c}
.bg-light-grey3      {background:#efebe9 !important; color: #78909c}


.no-bg      {background: none; }
.bg-blue      {background:#90caf9 !important; color: white} 
.bg-purple    {background:#b39ddb !important; color: white}
.bg-indigo    {background:#9fa8da !important; color: white}
.bg-cyan      {background:#80deea !important; color: white}
.bg-teal      {background:#80cbc4 !important; color: white}
.bg-green     {background:#a5d6a7 !important; color: white}
.bg-grey      {background:#b0bec5 !important; color: white}
.bg-red       {background:#ef9a9a !important; color: white}
.bg-pink      {background:#f48fb1 !important; color: white}
.bg-black      {background:black !important; color: white}
.bg-white      {background:white !important; color: #78909c}

.bg-dark-blue      {background:#2980b9 !important; color: white} 
.bg-dark-purple    {background:#8e44ad !important; color: white}
.bg-dark-cyan      {background:#16a085 !important; color: white}
.bg-dark-green     {background:#27ae60 !important; color: white}
.bg-dark-grey      {background:#7f8c8d !important; color: white}
.bg-dark-fb-grey      {background:#19212b !important; color: white}
.bg-light-fb-grey      {background:#262f3d !important; color: white}
.bg-dark-red       {background:#c0392b !important; color: white}

.bg-asphalt       {background:#cfd8dc !important; color: grey}



.bg-success-h1 {background:#88CC88;}
.bg-success-h2 {background:#88CC88	;}

.pink { color: #f06292 }
.slate { color: #78909c }
.teal { color: #4db6ac }



.dark-blue      {color :#1976d2;} 
.dark-red       {color :#d32f2f;}
.dark-cyan      {color :#16a085;}
.dark-green     {color :#2e7d32;}

.primary-blue { color: #2980b9; }
.blue      {color :#3498db;} 
.purple    {color :#9b59b6;}
.cyan      {color :#1abc9c;}
.green     {color :#2ecc71;}
.grey      {color :#95a5a6 !important}
.red       {color :#e74c3c !important;}
.orange    {color: #f9ad5e;}
.primary-black {color: #2E2E2E}
.black     {color :#78909c;}
.dark-fb-grey      {color :#19212b }
.light-fb-grey      {color :#262f3d}
.real-black     {color :#000000;}
.white     {color :white;}

.light-grey {color: #e9e7e7 !important}



/***********************/
/* STEPS LABEL         */
/***********************/
.phase-step {
    border-top-right-radius: 50%;
    border-bottom-right-radius: 50%;
    padding: 5px 15px;
    text-align: center;

}

/*************************/
/* LISTS                */
/*************************/
ol.no-bullets, 
ul.no-bullets {
	list-style: none;
}



/***********************/
/* EFFECTS             */
/***********************/

.fade-in-div {
	opacity: 1;
    -moz-transition: all 1s ease-in;  /* FF4+ */
    -o-transition: all 1s ease-in;  /* Opera 10.5+ */
    -webkit-transition: all 1s ease-in;  /* Saf3.2+, Chrome */
    -ms-transition: all 1s ease-in;  /* IE10? */
    transition: all 1s ease-in; 
}


.fade-out-div {
	opacity: 0.1;
    -moz-transition: all 1s ease-out;  /* FF4+ */
    -o-transition: all 1s ease-out;  /* Opera 10.5+ */
    -webkit-transition: all 1s ease-out;  /* Saf3.2+, Chrome */
    -ms-transition: all 1s ease-out;  /* IE10? */
    transition: all 1s ease-out;  
}

.greyscale-div { filter: grayscale(100); }

/***********************/
/* COMMON Classes         */
/***********************/
.hint {
	font-size: 12px;
	color: lightgrey;
}
.dark-hint {
	font-size: 12px;
	color: grey;
	opacity: 0.6;
}

.rounded-border { border-radius:  50%; }
.xsmall-border-radius { border-radius: 3px; }
.small-border-radius { border-radius: 5px; }
.med-border-radius { border-radius: 10px; }
.large-border-radius { border-radius: 20px; }

.char-circle {
    border-radius: 50%;
    width: 50px; 
    font-size: 20px;
    background: #3498db;
    border: 2px solid #3498db;
    color: white;
    margin: 0px auto;
    font-weight: bold;
}
.char-circle span {
    text-align: center;
    line-height: 50px;
    display: block;
}

.num-circle {
    background: #00cec9;
    color: white;
    padding: 4px 25px;
    border-radius: 50px;
}

/***********************/
/* NAV BAR             */
/***********************/

.navbar:hover {
	/*background: #2980b9; */
	background: #29b6f6;

}
.navbar-brand {
	padding: 15px 8px;
}

.navbar .logo .dept-name {
	letter-spacing: .5px;
	text-shadow: 0px 1px 0px black;
	font-size: 1.5em;
}

.navbar {
	margin-bottom: 0px;
	/*background: #34495e;*/
	background: #29b6f6;
	border-color: #29b6f6;
 }
.navbar-inverse .navbar-nav>li>a {
    color: white;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    font-weight: 100;
}
.navbar-inverse .navbar-brand {
	color: white;
}

.navbar .logo {
	width: 240px;
}

.navbar-brand-logo {
	width: 25%;
}

.navbar .logo img {
    display:inline;
    margin-top: -5px;
    height: 32px;
}
.logo-text {
    color: #2ecc71;
    font-family: 'Roboto', sans-serif;
}

.logout-button {
	color: #d9534f;
    background: none;
    border: none;
}

/***********************/
/* BREADCRUMBS         */
/***********************/
.breadcrumb-row {
	background: white;
	padding: 8px 0px;
	text-transform: uppercase;
}

.breadcrumb {
    padding: 0px;
    margin-bottom: 0px;
    background: white;
    font-size: 11px;
}

.breadcrumb a {
	color: #7f8c8d;
}

.breadcrumb .active {
	color: #c6c6c6;
}

.breadcrumb > li + li::before {
    color: #ccc;
    content: ">";
    font-size: 1.2em;
    vertical-align: middle;
}


/***********************/
/* TITLE BAR           */
/***********************/
.title-bar-button {
	margin-top: 25px;
}


/***********************/
/* ACTION ICONS        */
/***********************/
.action-icon:hover {
	opacity: 0.7;
}

.assign-to-icon {
	width: 16px;
}


/***********************/
/* PROJECT             */
/***********************/
.project-code {
    width: 100px;
    text-transform: uppercase;
    color: #3498db;
}

/***********************/
/* SLACK ISSUE ROW     */
/***********************/
.scrolling-wrapper-flexbox {
  display: flex;
  flex-wrap: nowrap;
  /* overflow-x: auto; */

}

.scrolling-wrapper-flexbox .phase-row {
  flex: 0 0 auto;
  margin-right: 3px;
}
.phase-row {
  min-width: 300px;
  max-width: 300px;
  margin:10px 3px;
  /* min-height: 600px; */
  padding: 8px;
  border-radius: 5px;
  max-height: 90vh;
  /* min-height: 700px;*/
  height: max-content;
  overflow: auto;
}
#issues-list-container .phase-row::-webkit-scrollbar {
    width: 0;
    height: 0;
    display: none;
}
.scrolling-wrapper, .scrolling-wrapper-flexbox {
  /* height: 100%; */
  margin-bottom: 0px;
  /* padding-left: 12px; */
  width: 100%;
  -webkit-overflow-scrolling: touch;
}
/* .scrolling-wrapper::-webkit-scrollbar , .scrolling-wrapper-flexbox::-webkit-scrollbar {
  display: none;
} */



/***********************/
/* ISSUES              */
/***********************/
.not-active-issue {
	background: white;
	opacity: .2;
}

.issue-status {
    font-size: 1em;
    font-weight: 400;
}

.sub-child-issue {
	border-left: 4px solid #9ccc65;
	margin-left: 20px;
}

.issue-card{
  width: 90%;
  margin: 30px auto;
  border-radius: 5px;
  /*background: #0277bd; */
  background: #2980b9;
  padding: 15px 15px 15px 15px;
}

.issue-card-edit:hover {
	cursor: pointer;
	background: #29b6f6;
}

.issue-card-view {
	background: #eceff1;
	/* background: #00796b; */
	/*background: #4890b0; */
	/*background: #262f3d;*/
}

.issue-card-view:hover {
	cursor: pointer;
	background: #4890b0;
}



/*****************************/
/*      VERTICAL TAB         */
/*****************************/
div.bhoechie-tab-container{
  z-index: 10;
  background-color: #ffffff;
  padding: 0 !important;
  margin-top: 20px;
  margin-left: 50px;
  margin-bottom: 70px;
  /*
  border-radius: 4px;
  -moz-border-radius: 4px;
  border:1px solid #ddd;
  -webkit-box-shadow: 0 6px 12px rgba(0,0,0,.175);
  box-shadow: 0 6px 12px rgba(0,0,0,.175);
  -moz-box-shadow: 0 6px 12px rgba(0,0,0,.175);*/
  background-clip: padding-box;
  opacity: 0.97;
  filter: alpha(opacity=97);
}
div.bhoechie-tab-menu{
  padding-right: 0;
  padding-left: 0;
  padding-bottom: 0;
}
div.bhoechie-tab-menu div.list-group{
  margin-bottom: 0;
}
div.bhoechie-tab-menu div.list-group>a{
  margin-bottom: 0;
}
div.bhoechie-tab-menu div.list-group>a .glyphicon,
div.bhoechie-tab-menu div.list-group>a .fa {
  color: #5A55A3;
}
div.bhoechie-tab-menu div.list-group>a:first-child{
  border-top-right-radius: 0;
  -moz-border-top-right-radius: 0;
}
div.bhoechie-tab-menu div.list-group>a:last-child{
  border-bottom-right-radius: 0;
  -moz-border-bottom-right-radius: 0;
}
div.bhoechie-tab-menu div.list-group>a.active,
div.bhoechie-tab-menu div.list-group>a.active .glyphicon,
div.bhoechie-tab-menu div.list-group>a.active .fa{
  background-color: #5A55A3;
  background-image: #5A55A3;
  color: #ffffff;
}
div.bhoechie-tab-menu div.list-group>a.active:after{
  content: '';
  position: absolute;
  left: 100%;
  top: 50%;
  margin-top: -13px;
  border-left: 0;
  border-bottom: 13px solid transparent;
  border-top: 13px solid transparent;
  border-left: 10px solid #5A55A3;
}

div.bhoechie-tab-content{
  background-color: #ffffff;
  /* border: 1px solid #eeeeee; */
  padding-left: 20px;
  padding-top: 10px;
}

div.bhoechie-tab div.bhoechie-tab-content:not(.active){
  display: none;
}




/******************************/
/* MDL OVERRIDES              */
/******************************/
.mdl-button--raised.mdl-button--colored {
	color: white;
}

.mdl-button--accent.mdl-button--accent.mdl-button--raised, 
.mdl-button--accent.mdl-button--accent.mdl-button--fab {
	color: white;
}

.mdl-button--fab{
    font-size: 6px;
    height: 36px;
    min-width: 36px;
    width: 36px;
}

.mdl-tooltip {
	font-size: 12px;
}

.mdl-button--micro-fab {
    height: 30px;
    min-width: 30px;
    width: 30px;
    background: none;
    box-shadow: none;
}

.mdl-button--micro-fab .material-icons {
	font-size: 18px;
}


label,
.mdl-textfield--floating-label.is-focused .mdl-textfield__label,
.mdl-textfield--floating-label.is-dirty .mdl-textfield__label,
.mdl-textfield--floating-label.has-placeholder .mdl-textfield__label {
	font-family: 'Roboto', sans-serif;
    font-size: 1.1rem;
    top: 0px;
    font-weight: 400;
	color: rgb(3,169,244);
	opacity: 0.7;
}

.mdl-textfield__extrawide {
	width: 500px;
}

.mdl-textfield__label {
        font-size: 1em;
	font-weight: 400;
	color: #78909c;
}


.mdl-square-card {
  width: 320px;
  height: 320px;
}
.mdl-square-card > .mdl-card__title {
  color: #fff;
}


/* mdl menu items will be black and not blue */
.mdl-menu__item a {
	color: black;
}

/* mdl menus will have rounded borders */
.mdl-menu__outline {
    border-radius: 8px;
}


/* No-hover button */
.mdl-button-nohover:hover {
 background-color: none !important;
}

	

/******************************/
/* SPRINTS                    */
/******************************/
.show-on-hover-element,
.show-on-hover {
    opacity: 0;
}

.hide-on-hover {
    opacity: 0;
}

.highlight-on-hover {
    opacity: 0.4;
    -webkit-transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    -o-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
}

.highlight-on-hover:hover,
.show-on-hover:hover {
    opacity: 1 !important;
    -webkit-transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    -o-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
}

.sprint-status {
    font-size: .6em;
    vertical-align: middle;
    opacity: .7;
    margin-left: 15px;
    font-weight: normal;
    margin-top: 0px;
}

.sprint-status .material-icons {
    font-size: 18px;
    padding: 0px 3px 4px 0px;
    margin: 0px;
    vertical-align: middle
}

.sprint-block .table>tbody>tr>td, 
.sprint-block .table>tbody>tr>th, 
.sprint-block .table>tfoot>tr>td, 
.sprint-block .table>tfoot>tr>th, 
.sprint-block .table>thead>tr>td, 
.sprint-block .table>thead>tr>th {
	border-top: none;
	cursor: default;
}



.panel-heading {
	padding: 1px 15px;
}
/******************************/
/* COMMENTS                   */
/******************************/
/*.comment-box .edit-comment,
.comment-box .delete-comment {
	opacity: 0.1;
}

.comment-box .new-comment {
	opacity: 1;
}

.comment-box {
	border-bottom: 1px solid #fafafa;
}

.comment-box .comment {
	padding: 10px;
	background: white;
}
.comment-box .comment:hover {
	background: #fafafa;
}

#comment-new {
	border-bottom: none;
}

#comment-new .comment {
	background: none;
}

.comment-box .note-editor {
	border: 2px solid #0d99ff;
	box-shadow: none;
	width: 125%;
    left: -61px;
    bottom: -27px;
}
.comment-box .note-editor .note-status-output{
	display:none;
}
.comment-box .note-editor .note-myCustomGroup .new-comment{    
    left: 301px;
    font-size: 11px;
    border-radius: 5px;
    text-transform: none;
    max-height: 27px;
    min-width: 93px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.comment-box  #comment-form-new{
	position: fixed;
    bottom: 0;
    width: 544px;
    left: 110px;
    margin-bottom: 27px;
}*/
.large-tab {
    font-size: 1.2em;
    text-transform: uppercase;
    padding: 15px 25px 15px 25px;
}

/**********************************/
/*     WORKFLOW > PHASE > FORM    */
/**********************************/
.phasefield-form .mdl-textfield { width: 100% }
.phasefield-form .input-group { width: 100%; }
/* .phasefield-form .mdl-radio__label { color: grey; font-weight: 200; }
.phasefield-form .checkbox {
	color: gray;
	font-size: 1.2em;
	padding-left: 20px;
	padding-bottom: 5px;
} */
.mdl-checkbox__label, .mdl-radio__label {
    color: #000000;
}

/*******************************************/
/*     WORKFLOW > PHASE > FORM > RECORD    */
/*******************************************/
.phase-field-record .selection {
        padding: 50px 0px;
        font-size: 1.6em;
}

.phase-field-record .select2-container--default .select2-selection--single {
	border: none;
 }

.phase-field-record .select-options-row { display: none; }
.phase-field-record .mdl-textfield {
    max-width: 100%;
    width: 100%;
}
.phase-field-record .input-group { width: 100%; }


/* List labels to be hidden on click */
.phase-field-record ol li label,
.phase-field-record ol li .mdl-textfield--floating-label.is-focused .mdl-textfield__label,
.phase-field-record ol li .mdl-textfield--floating-label.is-dirty .mdl-textfield__label,
.phase-field-record ol li .mdl-textfield--floating-label.has-placeholder .mdl-textfield__label {
        display: none;
}

/***********  OL  ***********/
.phase-field-record ol.select-options {
  list-style: none;
  counter-reset: li;
  padding-left: 16px;
  margin-bottom: 0;
}

/***********  CHECKBOX  ***********/
.phase-field-record ol.select-options li.li-checkbox:before {
    content: "\e157";
    font-family: 'Glyphicons Halflings';
    font-size: 1.2em;
    float: left;
    margin-left: -1.5em;
    margin-right: 0.5em;
    color: #CCCCCC;
    position: absolute;
    text-align: right;
    direction: rtl;
    font-weight: bold;
    font-size: 1.3em;
}

/***********  RADIO  ***********/
.phase-field-record ol.select-options li.li-radio:before {
    content: "\e165";
    font-family: 'Glyphicons Halflings';
    font-size: 1.2em;
    float: left;
    margin-left: -1.5em;
    margin-right: 0.5em;
    text-align: right;
    direction: rtl;
    font-weight: bold;
    font-size: 1.3em;
    color: #CCCCCC;
    position: absolute;
}

/***********  DROPDOWN  ***********/
.phase-field-record ol.select-options li.li-dropdown {
    counter-increment: li;
}
.phase-field-record ol.select-options li.li-dropdown,
.phase-field-record ol.select-options li.li-radio,
.phase-field-record ol.select-options li.li-checkbox {
    display: grid;
    grid-template-columns: 90% 10%;
    gap: 10px;
    padding: 10px;
}

.phase-field-record ol.select-options li.li-dropdown:before {
    content: counter(li);
    color: #CCCCCC;
    display: inline-block;
    width: 1em;
    margin-left: -1.5em;
    margin-right: 0.5em;
    text-align: right;
    direction: rtl;
    font-weight: bold;
    font-size: 1.3em;
    position: absolute;
}


/*----- Lookup Fields -------*/
.phase-field-record .lookup-options-row { 
	display: none; 
}

.team-selected { 
	/*border-left: 5px solid white ; */
	background: #19212b;
	opacity: 1;
	border-top: none;
} 


.project-selected {
	background:#2980b9;
}

.project-selected .project-name {
	color: white;
	opacity: 1;
	font-weight: 400;
}

.project-selected .project-issue-counter {
	background:  #1565c0 !important;	
}


.team-element {
	padding: 14px 0px 14px 0px;
	overflow: hidden;
}

.team-element-menu {
	position: absolute;
	right: 0;
	padding-right: 5px;
	margin-top: -8px;
}





			


.toolbar-btns {
        margin: 0px 20px 0px 0px;
        padding: 0px !important;
        min-width: 38px;
        text-transform: none;
        color: #625f5f;
        border-radius: unset;
}
.project-setting-tab .active,
.issue-options-toolbar .active-tab {
	color: #29b6f6;
    border-bottom: 3px solid #29b6f6;
}
.animate-block {
    -webkit-transition:  0.2s ease;
    -moz-transition:  0.2s ease;
    -o-transition: 0.2s ease;
    transition:  0.2s ease;
}

.col-xs-0 {
	width: 0%;
}

.teams-bar .xpull-right .mdl-menu__container{
    position: fixed;
}

/*****************/
/*     OVERFLOW  */
/*****************/
.overflow-visible { overflow: visible !important; }
.overflow-x-visible { overflow-x: visible !important; }
.overflow-y-visible { overflow-y: visible !important; }

.overflow-hidden { overflow: hidden !important; }
.overflow-x-hidden { overflow-x: hidden !important; }
.overflow-y-hidden { overflow-y: hidden !important; }

.overflow-scroll { overflow: scroll !important; }
.overflow-x-scroll { overflow-x: scroll !important; }
.overflow-y-scroll { overflow-y: scroll !important; }



/*****************/
/*     LOGIN     */
/*****************/
.or-content {
    width: 50%;
    text-align: center;
    border-bottom: 1px solid #ccc;
    line-height: 0.1em;
    margin: 35px auto 20px auto;
    opacity: 0.6;
}
.or-content span {
    color: #25383c !important;
    background: white;
    opacity: 0.7;
    padding: 0 10px;
    font-weight: normal;
    font-style: normal;
    font-stretch: normal;
    letter-spacing: 0.2px;
}


/*****************/
/*     MODAL     */
/*****************/
.modal .modal-body .row-eq-height {
    min-height: 100vh;
    max-height: 100%;
}
.modal .issue-center-content {
    /* background: #edf5fb; */
}
.modal .toolbar-btns {
    background: white;
}
/************************/
/*     PREVIEW-MODAL     */
/************************/
.preview-modal .modal-content {
    max-height: calc(100vh - 60px);
    border-radius: 15px;
    background-color: #262f3df7;
}
.preview-modal .modal-body {
    max-height: calc(100vh - 124px);
    display: flex;
    width: 100%;
    height: calc(100vh - 124px);
}
.preview-modal .modal-body img{
	object-fit: contain;
}
.preview-modal .modal-header .close{
	color: #fff;

}
.preview-modal .modal-title{
	display: flex;
}
.preview-modal .modal-title .modal-title-icon{
	width: 1.5em;
    height: 1.5em;
    border-radius: 0.2em;
}
.preview-modal .modal-title .modal-title-text{
	display: grid;
    margin-left: 0.5em;
    color: #fff;
}
.preview-modal .modal-title .modal-title-name{
	font-size: 0.6em;
    font-weight: 600;
}
.preview-modal .modal-title .modal-title-extension,
.preview-modal .modal-title .modal-title-filename{
    font-size: 0.5em;
}
.preview-modal .modal-footer{
	position: absolute;
	bottom: 0em;
	right: 0em;
}
/************************/
/*     MIDDLE-MODAL     */
/************************/
.middle-modal .modal-content {
    max-height: calc(100vh - 60px);
    border-radius: 15px;
}
.modal-backdrop.in {
    opacity: 0.7;
}
.middle-modal .modal-content.custom-scrollbar {
    overflow: overlay;
}
.middle-modal .modal-body {
    max-height: calc(100vh - 60px);
    /* overflow: hidden; */
}
.middle-modal .modal-body:has(.issue-center-content) {
    overflow: hidden;
}
.middle-modal.modal .issue-center-content,
.middle-modal.modal .issue-phase-list .phase-nav {
    max-height: calc(100vh - 60px);
    overflow-y: auto;
}
.middle-modal.modal .issue-center-content>.row {
    margin-right: 5px;
    margin-left: 0px;
}

.custom-scrollbar, .mdl-menu__container {
    -webkit-overflow-scrolling: touch;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
}

.custom-scrollbar::-webkit-scrollbar, .mdl-menu__container::-webkit-scrollbar {
    height: 8px;
    width: 8px
}

.custom-scrollbar::-webkit-scrollbar-button:end:increment,
.custom-scrollbar::-webkit-scrollbar-button:start:decrement,
.mdl-menu__container::-webkit-scrollbar-button:end:increment,
.mdl-menu__container::-webkit-scrollbar-button:start:decrement
 {
    background: #0000;
    display: none
}

.custom-scrollbar::-webkit-scrollbar-track-piece,
.mdl-menu__container::-webkit-scrollbar-track-piece {
    background: #091e4214;
    border-radius: 4px;
}

.custom-scrollbar::-webkit-scrollbar-track-piece:vertical:start,
.mdl-menu__container::-webkit-scrollbar-track-piece:vertical:start {
    border-radius: 4px 4px 0 0
}

.custom-scrollbar::-webkit-scrollbar-track-piece:vertical:end,
.mdl-menu__container::-webkit-scrollbar-track-piece:vertical:end {
    border-radius: 0 0 4px 4px
}

.custom-scrollbar::-webkit-scrollbar-track-piece:horizontal:start,
.mdl-menu__container::-webkit-scrollbar-track-piece:horizontal:start {
    border-radius: 4px 0 0 4px
}

.custom-scrollbar::-webkit-scrollbar-track-piece:horizontal:end,
.mdl-menu__container::-webkit-scrollbar-track-piece:horizontal:end {
    border-radius: 0 4px 4px 0
}

.custom-scrollbar::-webkit-scrollbar-thumb:horizontal,
.custom-scrollbar::-webkit-scrollbar-thumb:vertical,
.mdl-menu__container::-webkit-scrollbar-thumb:horizontal,
.mdl-menu__container::-webkit-scrollbar-thumb:vertical {
    background: #091e4221;
    border-radius: 4px;
    display: block;
    height: 48px
}


/* Fixing Media width */
audio, canvas, iframe, img, svg, video {
    vertical-align: middle;
    max-width: 100%;
}

/* Fixing Scrolls */
#main-content {
    height: 100vh;
    max-height: 100vh;
    min-height: unset;
}
.scrolling-wrapper-flexbox .phase-row {
    max-height: calc(100vh - 155px);
    overflow-x: hidden;
    padding-top: 0;
    padding-bottom: 0;
}
.col-md-8.center-content .col-sm-6.right .mdl-menu__container {
    max-height: calc(100vh - 150px);
    overflow-y: auto;
    overflow-x: hidden;
    box-shadow: 0 2px 2px 0 rgba(0,0,0,.14), 0 3px 1px -2px rgba(0,0,0,.2), 0 1px 5px 0 rgba(0,0,0,.12);
    border-radius: 8px;
    background-color: white;
}
.col-md-8.center-content .col-sm-6.right .mdl-menu__outline {
    max-height: calc(100vh - 150px);
    overflow: hidden;
    box-shadow: none;
}
#issues-list-container .phase-row:has(.stage-summary-param) #quick-add-card{
    top: 90px;
}
.phase-row:not(.expand-btn) .new-phase-quick-card {
    margin: 30px 0 30px 0;
}
.phase-row:not(.expand-btn) .xlead {
    padding-bottom: 15px !important;
    padding-top: 15px !important;
    position: sticky;
    top: 0;
    background-color: white;
    z-index: 2;
}
.phase-row:not(.expand-btn) #quick-add-card,
.phase-row:not(.expand-btn) #add-card {
    position: sticky;
    bottom: 0;
    background: white;
    opacity: 1;
    padding-bottom: 0;
    margin-bottom: 0;
}
.phase-row:not(.expand-btn) #quick-add-card{
    top: 50px;
    margin-top: 0;
    z-index: 1;
}
.phase-row:not(.expand-btn) #quick-add-card .msmall-padding{
    padding: 4px 7px 8px 14px;
}
.phase-row:not(.expand-btn) #add-card .msmall-padding {
    padding: 10px 7px;
}

.row.bg-secondary.no-margin.no-padding.med-padding-top.large-padding-bottom.show-on-hover-block {
    position: sticky;
    left: 0;
    z-index: 5;
}

.custom-scrollbar.custom-scrollbar-hover {
    overflow: overlay;
}
.col-md-1.teams-bar .teams-list {
    height: 100%;
    max-height: calc(100vh - 215px);
    overflow-y: hidden;
    overflow-x: hidden;
    scrollbar-width: thin;
}
.col-md-1.teams-bar .teams-list:hover {
    overflow-y: overlay;
}
.col-md-1.teams-bar .teams-list::-webkit-scrollbar {
    width: 5px;
}
.col-md-1.teams-bar .teams-list::-webkit-scrollbar-track {
    background: #19212b;
    border-radius: 10px;
}
.col-md-1.teams-bar .teams-list::-webkit-scrollbar-thumb {
    background: #104962;
}
.col-md-1.teams-bar .teams-list::-webkit-scrollbar-thumb:hover {
    background: #29b6f6;
}

/*********************/
/*   ISSUE ACTIVITY  */
/*********************/
.issue-activity-block{
    padding: 25px 0px;
}
.activity-view-block .activity-view-content .task-detail1 .assignees span:not(:first-child),
.activity-card .activity-card-detail .activity-detail .assignees span:not(:first-child){
    margin-left: -6px;
}
.add-activity,
.issue-activity-add-block #add-description-btn {
    background-color: #ECEFF2;
    color: #5A5D6E;
}
.activity-card .activity-card-option .card-options li:hover,
.activity-list-table .sub-filter .scroll .active a,
.activity-list-table .sub-filter li a:hover,
.activity-list-table .filter li button:hover{
    background-color: #EAF9F7;
    color: #136F63;
    font-weight: 600;
}
.activity-list-table .filter,
.activity-list-table .sub-filter,
.activity-card .activity-card-option .card-options{
    border-radius: 4px;
	border: 1px solid #F0F0F0;
	background: #FFF;
	box-shadow: 0px 2px 11px 0px rgba(0, 0, 0, 0.08);
}
.activity-card .activity-card-id .check-box,
.activity-list-table .sub-filter .scroll>li>a .check-box,
#assignee-dropdown .scroll>li>a .check-box{
    height: 1rem;
    width: 1rem;
    border-radius: 2px;
    border: 1px solid #D9D9D9;
    margin-left: auto;
}
.activity-card .activity-card-id .check-box i,
.activity-list-table .sub-filter .scroll>li>a .check-box i,
#assignee-dropdown .scroll>li>a .check-box i{
	display: none;
}
.activity-list-table .sub-filter .scroll .active .check-box,
.activity-card.multi-selected .activity-card-id .check-box{
	background-color: #008BF8;
}
.activity-card.multi-selected .activity-card-id .check-box i,
.activity-list-table .sub-filter .scroll .active .check-box i,
#assignee-dropdown .scroll .active .check-box i{
    display: block;
}
.activity-view-block .activity-view-content .task-detail1 .assignees span,
#assingees-list .user_icon {
    height: 2.5em;
    width: 2.5em;
    display: flex;
    justify-content: center;
    text-transform: uppercase;
}
.comment-block .note-editor .note-popover .note-hint-item:nth-child(1n+1) .team-members-tagging .user_icon,
.activity-view-block .activity-view-content .task-detail1 .assignees span:nth-child(1n+1),
.activity-card .activity-card-detail .activity-detail .assignees span:nth-child(1n+1),
#assignee-dropdown li:nth-child(1n+1) .team-members-selection .user_icon,
#assingees-list li:nth-child(2n+2) {
    color: #2E2F30;
    background-color: #B9D6F2;
}
.comment-block .note-editor .note-popover .note-hint-item:nth-child(2n+2) .team-members-tagging .user_icon,
.activity-view-block .activity-view-content .task-detail1 .assignees span:nth-child(2n+2),
.activity-card .activity-card-detail .activity-detail .assignees span:nth-child(2n+2),
#assignee-dropdown li:nth-child(2n+2) .team-members-selection .user_icon,
#assingees-list li:nth-child(3n+3) {
    color: #2E2F30;
    background-color: #C8EDE8;
}
.comment-block .note-editor .note-popover .note-hint-item:nth-child(3n+3) .team-members-tagging .user_icon,
.activity-view-block .activity-view-content .task-detail1 .assignees span:nth-child(3n+3),
.activity-card .activity-card-detail .activity-detail .assignees span:nth-child(3n+3),
#assignee-dropdown li:nth-child(3n+3) .team-members-selection .user_icon,
#assingees-list li:nth-child(4n+4) {
    color: #2E2F30;
    background-color: #FFC7CB;
}
.comment-block .note-editor .note-popover .note-hint-item:nth-child(4n+4) .team-members-tagging .user_icon,
.activity-view-block .activity-view-content .task-detail1 .assignees span:nth-child(4n+4),
.activity-card .activity-card-detail .activity-detail .assignees span:nth-child(4n+4),
#assignee-dropdown li:nth-child(4n+4) .team-members-selection .user_icon,
#assingees-list li:nth-child(5n+5) {
    color: #2E2F30;
    background-color: #FBF4E6;
}
.comment-block .note-editor .note-popover .note-hint-item:nth-child(5n+5) .team-members-tagging .user_icon,
.activity-view-block .activity-view-content .task-detail1 .assignees span:nth-child(5n+5),
.activity-card .activity-card-detail .activity-detail .assignees span:nth-child(5n+5),
#assignee-dropdown li:nth-child(5n+5) .team-members-selection .user_icon,
#assingees-list li:nth-child(6n+6) {
    color: #2E2F30;
    background-color: #B8BFFD;
}
.comment-block .note-editor .note-popover .note-hint-item:nth-child(6n+6) .team-members-tagging .user_icon,
.activity-view-block .activity-view-content .task-detail1 .assignees span:nth-child(6n+6),
.activity-card .activity-card-detail .activity-detail .assignees span:nth-child(6n+6),
#assignee-dropdown li:nth-child(6n+6) .team-members-selection .user_icon,
#assingees-list li:nth-child(7n+7) {
    color: #2E2F30;
    background-color: #D4FFDE;
}
.comment-block .note-editor .note-popover .note-hint-item:nth-child(7n+7) .team-members-tagging .user_icon,
.activity-view-block .activity-view-content .task-detail1 .assignees span:nth-child(7n+7),
.activity-card .activity-card-detail .activity-detail .assignees span:nth-child(7n+7),
#assignee-dropdown li:nth-child(7n+7) .team-members-selection .user_icon,
#assingees-list li:nth-child(8n+8) {
    color: #2E2F30;
    background-color: #CBCDD4;
}
.issue-activity-add-block .activity-edit-topbar .back-btn img,	
.activity-view-block .activity-view-topbar .back-btn img{
	width: 6px;
    height: 14px;
    margin-bottom: 2px;
}
.issue-activity-add-block .back-btn,	
.activity-view-block .activity-view-topbar .back-btn{
	color: #008BF8;
}

/*Activity alerts css*/
.activity-info{
	position: relative;
}
.activity-counter{
	position: absolute;
    top: -4px;
    right: -10px;
    border-radius: 10px !important;
}
.red-alert .activity-counter{
    background-color: #ed3358;
}
.green-alert .activity-counter,
.orange-alert .activity-counter{
    background-color: #2980b9;
}

.dashboard .empty-chart-container h4,
.edit-dashboard .empty-chart-container h4,
.edit-dashboard #stuck_cards h4,
.dashboard #stuck_cards h4 {
    color: #666;
    text-align: center;
    margin-top: 10px;
}
.dashboard .chart-container .no-data-banner-div,
.edit-dashboard .chart-container .no-data-banner-div {
    text-align: center;
    opacity: 0.5;
}

.custom-apexcharts-tooltip-title,
.custom-apexcharts-tooltip-text {
    font-size: 12px !important;
}

.grid-stack .grid-stack-placeholder>.placeholder-content {
    background-color: transparent !important;
    border: 3px dashed lightgray;
}

.grid-stack .grid-stack-placeholder.grid-stack-item {
    background: transparent;
}

.dashboard .custom-tables,
.dashboard #stuck_cards {
    display: flex;
    height: 100%;
    align-items: center;
}
.dashboard .custom-tables .dataTables_wrapper,
.dashboard #stuck_cards .dataTables_wrapper {
    width: 100%;
    margin-top: auto;
    margin-bottom: auto;
    padding-bottom: 15px;
}

.dashboard .grid-stack .grid-stack-item .widget-content .custom-tables .dataTables_wrapper .dataTables_info,
.dashboard .grid-stack .grid-stack-item .widget-content #stuck_cards .dataTables_wrapper .dataTables_info,
.dashboard .grid-stack .grid-stack-item .widget-content #stuck_cards .dataTables_wrapper .dataTables_paginate,
.dashboard .grid-stack .grid-stack-item .widget-content .custom-tables .dataTables_wrapper .dataTables_paginate {
    visibility: hidden;
}

.dashboard .grid-stack .grid-stack-item:hover .widget-content .custom-tables .dataTables_wrapper .dataTables_info,
.dashboard .grid-stack .grid-stack-item:hover .widget-content .custom-tables .dataTables_wrapper .dataTables_paginate,
.dashboard .grid-stack .grid-stack-item:hover .widget-content #stuck_cards .dataTables_wrapper .dataTables_info,
.dashboard .grid-stack .grid-stack-item:hover .widget-content #stuck_cards .dataTables_wrapper .dataTables_paginate {
    visibility: visible;
}

.single-line {
    white-space: nowrap;
    overflow: hidden;
    display: block;
    text-overflow: hidden;
}

/*DRAG AND DROP CSS*/
div.ui-sortable-helper {
	border: 1px dashed #78909c;
	transform: rotate(5deg);
	border-radius: 4px;
	background: #cae4ef;
}
div.ui-sortable-helper .project-name{
	color:#000000 !important;
}

div.ui-sortable-placeholder{
	visibility: visible !important;
    background-color: #29b6f6 !important;
	border: 1px dashed white !important;
	border-radius: 4px !important;
    opacity: 0.3 !important;
}
.phasefield.ui-sortable-helper,
.phase-row.ui-sortable-helper {
	border: 1px dashed #78909c;
	box-shadow: 0 20px 20px 0 rgba(0, 0, 0, .14), 0 20px 20px -2px rgba(0, 0, 0, .2), 0 20px 20px 0 rgba(0, 0, 0, .12);
    transform: none;
	border-radius: 4px;
	background: #cae4ef;
}
.ui-sortable-placeholder.phase-row{
    height: calc(100vh - 107px) !important;
    background-color: #29b6f6 !important;
    opacity: 0.3 !important;
    border: 1px dashed rgb(81, 3, 249) !important;
}
.ui-sortable-placeholder.phasefield{
    background-color: #29b6f6 !important;
    opacity: 0.3 !important;
    border: 1px dashed rgb(81, 3, 249) !important;
}

.formula-field-block .input-group .mdl-textfield__input.formula-field {
    color: #34495e;
    border-bottom: none;
}
.mdl-textfield .input-group .mdl-textfield__input.formula-field {
    color: #78909c;
}
.formula-field-block .tooltip .tooltip-inner,
.formula-field .tooltip .tooltip-inner {
    overflow-wrap: anywhere;
}
.mdl-textfield .input-group.formula-container .mdl-textfield__input.formula-field {
    padding-left: 15px;
}
.mdl-textfield .input-group.formula-container::before {
    content: "=";
    position: absolute;
    left: 0px;
    top: 50%;
    transform: translateY(-50%);
    pointer-events: none;
    color: #78909c;
    font-size: 20px;
    padding-left: 10px;
}
.disabled-field {
    pointer-events: none;
}
.exp-container input {
    padding-left: 0;
}
#formula-container .exp-container .exp-notification {
    bottom: 40%;
    top: unset !important;
    left: unset !important;
    right: -30px;
}
#formula-container .exp-container .exp-suggestions {
    min-height: auto;
}
#formula-container .exp-container .exp-opr-suggestions .exp-suggestion-item,
#formula-container .exp-container .exp-suggestions .exp-suggestion-item {
    min-width: auto;
}
#formula-container .exp-container .exp-suggestions .exp-suggestion-item.selected {
    font-weight: unset;
}
#formula:-webkit-autofill,
#formula:-webkit-autofill:hover, 
#formula:-webkit-autofill:focus, 
#formula:-webkit-autofill:active  {
    transition: background-color 5000s ease-in-out 0s;
}
#formula-container #formula:focus::placeholder {
    color: transparent;
}
.phase-field-record #formula-block .mdl-textfield {
    width: auto;
    max-width: none;
}
#formula-block #formula-error {
    display: none;
}
#formula-container .exp-container .exp-notification {
    display: none;
}

/************* FILTER ****************/
.space-between {
    justify-content: space-between;
}
.width-40 { 
    width: 40% !important;
}
.width-60 { 
    width: 60%;
}
.position-relative {
    position: relative;
}
.position-absolute {
    position: absolute
}
.ul-list-type-none {
    list-style-type: none;
}
.width-fit-content {
    width: fit-content;
}
.filter-type {
    list-style-type: none;
}
.flex-wrap-wrap {
    flex-wrap: wrap;
}
#filter-dropdown-menu {
    width: 450px;
    min-height: 400px;
    max-height: auto;
    position: absolute;
    background: white;
    border-radius: 8px;
    z-index: 1;
    top: 100%;
    right: 0;
    display: none;
}
#filter-dropdown-menu .filter-submenu {
    min-height: 400px;
    max-height: 600px;
    overflow-y: auto;
}
#filter-dropdown-menu .filter-menu {
	border-right: 1px solid #DAE5EE;
    position: relative;
    min-height: 400px;
    max-height: 600px;
    overflow-y: scroll;
}
#filter-dropdown-menu .main-filter-dropdown {
    min-height: 400px;
    max-height: 600px;
}
#filter-dropdown-menu .filter-submenu-left,
#filter-dropdown-menu .filter-submenu-right {
    height: 40px;
}
#filter-dropdown-menu .filter-submenu-left:hover,
.filter-submenu-left.active {
    background-color: #eee; 
    color: #6DBFF6;
    cursor: pointer;
}
#filter-dropdown-menu .filter-submenu-left.active .filter-phase-title {
    color: #29b6f6;
}
#filter-dropdown-menu .filter-submenu .filed-filter-dropdown {
    background-color: #eee;
    max-height: 400px;
    overflow-y: auto;
}
#filter-dropdown-menu .filter-submenu-left .filter-phase-title {
    font-size: 0.95em;
}
#filter-dropdown-menu .filter-submenu-right .filter-field-title {
    font-size: 0.9em ;
}
#filter-dropdown-menu .filed-filter-dropdown .filter-field-condition,
#filter-dropdown-menu .filed-filter-dropdown .input-box-suffix {
    font-size: 0.8em;
}
#searched-filters .filter-chip-text {
    height: auto;
    line-height: 21px;
    opacity: 0.8;
}
#searched-filters .filter-chip-text:hover {
    opacity: 1;
}
#searched-filters .cancel-filter-value {
    line-height: 1.45;
    font-size: 18px;
}
#searched-filters #clear-btn {
    font-size: 14px;
}
#searched-filters .custom-separator li {
    height: 26px;
    line-height: 30px;
}
#searched-filters .separator-btn {
    text-transform: lowercase;
    padding: 0px 0px 0px 7px;
    font-weight: lighter;
    margin: 0px 4px;
    min-width: 50px;
}
#clear-btn:hover {
    text-decoration: underline;
}
.applied-filter-values {
    display: contents !important;
}
#searched-filters {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    width: fit-content;
    position: sticky;
    z-index: 1;
    left: 0;
    row-gap: 10px;
    font-size: 0.9em;
    zoom: 90%;
}
.dashboard .chart-container {
    width: 100%;
    height: 100%;
}
.dashboard .empty-chart-container {
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 3rem;
}
.filtered-dashboard .standard-chart {
    filter: blur(2px);
    pointer-events: none;
}
#filter-dropdown-menu .filter-submenu .filed-filter-dropdown .between-inputs-block {
    display: flex;
    align-items: flex-end;
    justify-content: space-evenly;
}
#filter-dropdown-menu .filter-phase-title {
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
    width: 100%;
}
.card-age {
    color: #000000;
}
.issue-card-edit .card-age {
    color: white;
}

#issue-table_wrapper #issue-table_filter {
    margin-bottom: 10px;
}

/* ******************************************* */
/*      issu/issue/list/list-wraper.html       */
/* ******************************************* */

.new-phase-quick-card .card-title:focus,
.new-phase-quick-card .card-title:focus-visible {
    outline: none;
    border: none;
}
.new-phase-quick-card .card-title::-webkit-input-placeholder  {
    color: #515151;
}
#issue-quick-card-add-form .new-phase-quick-card-field {
    width: 90%;
    border-radius: 5px;
    font-size: 15px;
    height: 44px;
    min-height: 44px;
    resize: none;
    padding: 15px 15px 15px 15px;
    cursor: text;
}
#new-phase-quick-card-field-error {
    text-align: left;
    width: 100%;
    padding-left: 20px;
    margin-bottom: 0;
}
.scrolling-wrapper-flexbox > .phase-row:nth-child(2) > .issue-draggable > .issue-card:nth-child(2) {
    margin-top: 2px;
}
.new-issue-animate {
    animation: fadeInDown .5s ease-out 0s;
}

/* ***************************************** */
/*            Activity log styles            */
/******************************************* */

.activity-log-entry {
    padding: 0px 10px 10px;
}
.activity-log-header {
    font-weight: bold;
    margin-bottom: -5px;
    font-size: 12px;
}
.activity-log-title {
    color: #333;
}
.activity-log-body {
    display: flex;
    align-items: baseline;
    padding: 5px 0 0px 5px;
}
.user-avatar {
    width: 30px;
    height: 30px;
    border-radius: 50%;
    background-color: #fff;
    margin-right: 10px;
    display: flex;
    justify-content: center;
    align-items: center;
    border: 1px solid #3E60DF !important;
    color: #3E60DF ;
    font-size: 13px;
    position: relative;
    z-index: 1;
}
.activity-log-wrapper{
    width: 100%;
}
.activity-log-details {
    padding-top: 10px;
    color: #979797; /*applying font color to the words: "added a comment from to'*/
    font-size: 12px;
    position: relative;
    z-index: 0;
}
.fieldName-data,
.fieldName-data b{
    color: #000 !important; /*applying font color to field names*/
    font-weight: normal !important; /*applying font weight to field names*/
}
.entityTypeName{
    color: #000; /*applying font color to entirytypename in project activity log*/
}
.activity-log-details.comment{
    border-radius: 5px;
    background: #F5F5F5;
    border: 1px solid #DCE5EE;
    padding: 10px 15px 10px;
    margin-top: 6px;
    margin-left: -1px;
}
.activity-log-details.comment p{
    margin-bottom: 0px;
    font-size: 12px;
}
.activity-data
{
    color: #000 !important; /*applying font color to old & new values*/
    font-weight: normal !important; /*applying font weight to old & new values*/
    font-size: 12px !important; /*applying font size to old & new values*/
}
.activity-user{
    font-weight: 500 !important;
    color: #000 !important; /*applying font color to userName*/
}
.activity-log-details:before {
    content: '';
    position: absolute;
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: #3E60DF;
    left: -28px;
    top: 18px;
    z-index: 0;
}
.activity-log-details:after {
    content: '';
    width: 1px;
    display: inline-block;
    height: 100%;
    background: #3E60DF;
    position: absolute;
    left: -25px;
    top: 26px;
    z-index: 0;
}
.remove-after:after {
    display: none;
}
.time-ago {
    color: #888;
    font-size: 0.9em;
    margin-top: 5px;
}
.activity-log-date,
.task-id{
    color: #29b6f6;
    font-weight: 500;
}
.panel{
    border-radius: 13px;
}
.no-activity {
    text-align: center;
    color: #888;
    font-size: 1.2em;
    margin-top: 20px;
}
.comment strong p {
    margin-bottom: 0px;
}
/* Ensure the entire first line is displayed inline */
.activity-log-details.comment .activity-user {
    display: inline;
    font-weight: bold;
}
.activity-log-details.comment .activity-data {
    display: block; /*old comment*/
    margin-top: 5px;
}
/*changed Comment from*/
.activity-log-details.comment .activity-user:after {
    content: ""; 
}
/*to*/
.activity-log-details.comment .transition-text {
    display: block; 
    margin-top: 10px; 
}
/*New comment*/
.activity-log-details.comment .activity-data {
    display: block;
}
/*Timestamp*/
.activity-log-details.comment .time-ago {
    display: block;
}
/* ***************************************** */
/*  One Project and One Workflow styles      */
/******************************************* */
#issues-list-container{
    .scrolling-wrapper-flexbox .add-phase-btn{
        color: #29b6f6;
        padding: 0px 7.5px 0px;
    }
    .scrolling-wrapper-flexbox .add-phase-text div{
        font-size: 25px;
        position: absolute;
        left: -22px;
        width: 45px;
        height: 45px;
        z-index: 2;
        display: flex;
        align-items: center;
        justify-content: center;
        border-radius: 50%;
        background: #ffffff95;
        box-shadow: 0 5px 5px 0 #00000020;
        top: -16px;
        color: #656565;
    }
    .scrolling-wrapper-flexbox .add-phase-btn .new-phase-input-block .mdl-textfield{
        max-width: 270px;
    }
    .scrolling-wrapper-flexbox .add-phase-btn .new-phase-input-block #ajax-save-button{
        background: rgb(3, 169, 244);
        margin-left: 0;
        opacity: .5;
        height: 35px;
        margin-right: 8px;
        text-transform: capitalize;
    }
    .scrolling-wrapper-flexbox .add-phase-btn .new-phase-input-block .new-phase-close-icon{
        height: 35px;
        display: flex;
        justify-content: center;
        align-items: center;
        border-radius: 2px;
    }
    .scrolling-wrapper-flexbox .add-phase-btn .new-phase-input-block .new-phase-close-icon:hover{
        background: #dfdede;
    }
    .scrolling-wrapper-flexbox .add-phase-btn .new-phase-input-block #ajax-save-button:hover{
        opacity: 1;
    }
    .scrolling-wrapper-flexbox .show-add-phase-text{
        position: relative;
        opacity: 1;
        transition: all .15s;
    }
    .scrolling-wrapper-flexbox .hide-new-phase-input-block{
        width: 0;
        transform: scale(0);
        padding-top: 0px;
        height: 0;
        transition: all .15s;
    }
    .scrolling-wrapper-flexbox .hide-add-phase-text{
        transition: all .15s; 
        position: relative;   
        opacity: 0;
    }
    .scrolling-wrapper-flexbox .show-new-phase-input-block{
        width: auto;
        transform: scale(1);
        padding: 0px 15px;
        margin: 0px 9px 0px; 
        border-radius: 4px;
        transition: all .15s;
    }
    .scrolling-wrapper-flexbox .hide-add-phase-btn{
        display: none;
    }
    .scrolling-wrapper-flexbox .add-new-phase-btn-container{
        margin-top: -15px;
        padding-bottom: 5px;
    }
    .scrolling-wrapper-flexbox .phase-row{
        transition: all .5s;
    }
}
/* ***************************************** */
/*         Table UI Styles        */
/******************************************* */
#issues-list-container .width-fit-content{
    width: 100%;
}
.issue-table-container {
    padding: 0 15px;
    width: 100%;
    /* Table wrapper */
    .table-wrapper {
        padding: 15px;
    }
    .table-wrapper.table-responsive{
        min-height: 500px;
    }
    /* Search and controls wrapper */
    .controls-wrapper {
        display: flex;
        justify-content: space-between;
        align-items: center;
        margin-bottom: 20px;
        padding: 10px 0;
        width: 100%;
    }
    /* Search box styling */
    .search-box {
        position: relative;
        width: 300px;
    }
    .search-icon {
        position: absolute;
        left: 10px;
        top: 50%;
        transform: translateY(-50%);
        color: #808080;
        font-size: 16px;
        font-weight: 100;
    }
    .search-input {
        width: 100%;
        padding: 8px 12px 8px 35px;
        border: 1px solid #ddd;
        border-radius: 4px;
        font-size: 14px;
        outline: none;
    }
    .search-input::placeholder{
        color: #808080;
        font-size: 12px;
    }
    /* Right-aligned buttons wrapper */
    .buttons-wrapper {
        display: flex;
        align-items: center;
        gap: 10px;
    }
    /* Manage Columns Dropdown Styles */
    .manage-columns {
        position: relative;
    }
    .manage-columns .btn {
        background-color: white;
        border:1px solid #ddd;
        color: #34495E;
        padding: 6px 12px;
        display: flex;
        align-items: center;
        gap: 5px;
    }
    .export-dropdown:focus,
    .manage-columns .btn:focus {
        background-color: #03A9F4;
        border-color: #0277BD;
        color: white;
        outline: none;
    }
    .manage-columns .dropdown-menu {
        background: white;
        border: 1px solid #ddd;
        border-radius: 4px;
        box-shadow: 0 2px 5px rgba(0,0,0,0.1);
        margin-top: 2px;
        right: auto;
        left: 0;
        top: 41px;
    }
    .checkbox-list {
        display: flex;
        flex-direction: column;
    }
    .checkbox-item {
        margin: 0;
        cursor: pointer;
        white-space: nowrap;
        transition: background-color 0.2s;
    }
    .checkbox-item:hover {
        background-color: #f5f5f5;
    }
    .checkbox-item input[type="checkbox"] {
        margin-right: 8px;
    }
    .manage-columns .checkbox-item {
        display: block;
        padding: 8px 12px;
        clear: both;
        font-weight: 400;
        line-height: 1.42857143;
        color: #333;
        white-space: nowrap;
        cursor: pointer;
        margin: 0;
        font-size: 14px;
    }
    .manage-columns .checkbox-item:hover {
        background-color: #f5f5f5;
    }
    .manage-columns .checkbox-item input[type="checkbox"] {
        margin-right: 8px;
    }
    button.btn.btn-info.manage-dropdown{
        font-size: 12px;
        padding: 10px 15px;
    }
    .btn-group>.btn:first-child:not(:last-child):not(.dropdown-toggle){
        border-radius: 4px;
    }
    /* Export button styling */
    .export-button {
        position: relative;
    }
    .export-dropdown {
        background: white;
        border: 1px solid #ddd;
        padding: 8px 15px;
        border-radius: 4px;
        cursor: pointer;
        display: inline-flex;
        align-items: center;
        gap: 5px;
        font-size: 12px;
    }
    .export-menu {
        position: absolute;
        right: 0;
        top: 100%;
        background: white;
        border: 1px solid #ddd;
        border-radius: 4px;
        box-shadow: 0 2px 5px rgba(0,0,0,0.1);
        display: none;
        z-index: 1000;
        margin-top: 4px;
    }
    .export-menu.show {
        display: block;
    }
    .export-menu a {
        display: block;
        padding: 8px 23px;
        color:#808080;
        text-decoration: none;
        font-size: 14px;
        font-weight: normal;
    }
    .export-menu a:hover {
        background-color: #f5f5f5;
        color: #34495E;
    }
    /* Table styling */
    .table {
        width: 100%;
        margin-bottom: 0;
    }
    .table > thead > tr > th {
        background-color: #f8f9fa;
        border-bottom: 2px solid #dee2e6;
        padding: 12px 8px;
    }
    /* Status badge styling */
    .status-badge {
        padding: 5px 10px;
        border-radius: 3px;
        font-size: 12px;
        font-weight: 500;
    }
    /* Pagination styling */
    .dataTables_wrapper .dataTables_paginate {
        padding-top: 15px;
        text-align: center;
    }
    .paginate_button {
        padding: 5px 10px;
        margin: 0 2px;
        border-radius: 3px;
    }
    /* Activity counter styles */
    .activity-counter.label {
        padding: 0.3em 0.5em;
        top: -5px;
    }
    .activity-alert .clickable-pointer img{
        width: 12px ;
        height: 15px ;
    }
    span.activity-count.small.rounded-border.flex-block.justify-center.item-center{
        color: white ;
        padding: 0.3em 0.5em ;
        font-size: 9px ;
        font-weight: 900 ;
    }
    .activity-counter.label.align-middle.xsmall{
        padding: 0px ;
    }
    span.activity-count.small.rounded-border.flex-block.justify-center.item-center{
        line-height: 1;
    }
    .activity-counter.rounded-border.flex-block.justify-center{
        top: -5px;
    }
    /* Issue styles */
    .issue-number{
        color: #34495E;
        font-weight: 500;
        font-size: 14px;
        text-align: left; 
        display: inline-block;
    }
    .issue-name{
        color: #03A9F4;
        font-weight: 400;
        font-size: 14px;
        text-transform: capitalize;
    }
    #issue-table_wrapper #issue-table th{
        border-bottom: none;
        background-color: white;
        padding-left: 5px;
    }
    #issue-table td{
        font-size: 14px;
    }
    #issue-table td {
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        padding: 8px;
    }
    #issue-table .label-tags{
        cursor: default;
    }
    span.label.small.issue-number{
        padding: 0;
    }
    #issue-table td, #issue-table td{
        padding-left: 16px !important; 
    }
    #issue-table thead th {
        background-color: #f8f9fa;
        font-weight: 500;
        border-bottom: 1px solid #dee2e6;
        vertical-align: middle;
    }
    .grip-icon {
        margin-right: 3px;
        color: white; 
        cursor: move;
        transition: opacity 0.2s ease-in-out, color 0.2s ease-in-out;
        opacity: 0; 
    }
    .grip-icon:hover {
        cursor: grab;
    }
    table.dataTable thead th:hover .grip-icon {
        opacity: 0.5;
        color: #34495e;
    }
    table.dataTable thead .sorting::before,
    table.dataTable thead .sorting::after,
    table.dataTable thead .sorting_asc::before,
    table.dataTable thead .sorting_asc::after,
    table.dataTable thead .sorting_desc::before,
    table.dataTable thead .sorting_desc::after {
        transition: opacity 0.2s ease-in-out;
        color: white;
    }
    table.dataTable thead th:hover .sorting::before,
    table.dataTable thead th:hover .sorting::after,
    table.dataTable thead th:hover .sorting_asc::before,
    table.dataTable thead th:hover .sorting_asc::after,
    table.dataTable thead th:hover .sorting_desc::before,
    table.dataTable thead th:hover .sorting_desc::after,
    table.dataTable thead .sorting:hover::before,
    table.dataTable thead .sorting:hover::after,
    table.dataTable thead .sorting_asc:hover::before,
    table.dataTable thead .sorting_asc:hover::after,
    table.dataTable thead .sorting_desc:hover::before,
    table.dataTable thead .sorting_desc:hover::after {
        opacity: 0.5;
        color: #34495e;
    }
    #issue-table thead th {
        position: relative;
        padding-right: 20px !important;
    }
    .dataTables_wrapper .bottom {
        display: flex;
        justify-content: space-between;
        align-items: center;
    }
    .dataTables_length {
        margin-right: 20px;
    }
    .dataTables_paginate {
        display: flex;
        align-items: center;
        justify-content: center;
    }
    /* Pagination Buttons */
    .paginate_button {
        padding: 8px 12px;
        margin: 0 2px;
        color: #666;
        border: 1px solid #ddd;
        background-color: #fff;
        cursor: pointer;
        border-radius: 4px;
        text-decoration: none;
        font-size: 14px;
    }
    .paginate_button:hover {
        background-color: #f5f5f5;
        color: #333;
        border-color: #ddd;
    }
    .paginate_button.current {
        background-color: #03A9F4;
        color: white;
        border-color: #0277BD;
    }
    .paginate_button.disabled {
        color: #999;
        cursor: not-allowed;
        background-color: #fff;
    }
    /* Previous/Next buttons */
    .paginate_button.previous,
    .paginate_button.next {
        font-weight: normal;
    }
    /* Entries info */
    .dataTables_info {
        color: #666;
        font-size: 14px;
    }
    /* Show entries dropdown */
    .dataTables_length select {
        padding: 6px 12px;
        border: 1px solid #ddd;
        border-radius: 4px;
        margin: 0 5px;
    }
    /* Ellipsis */
    .ellipsis {
        padding: 8px 12px;
        color: #666;
    }
    /* Initial Pagination Style */
    div#issue-table_paginate{
        color:#337AB7;
        padding: 0;
        background-color: white;
    }
    #issue-table_paginate a.paginate_button{
        border: 1px solid #ddd;
        margin: 0;
    }
    #issue-table_wrapper #issue-table_paginate a.paginate_button:hover,
    #issue-table_wrapper #issue-table_paginate .pagination > li > a:hover {
        color: white;
        cursor: pointer;
        background-color: #03A9F4;
        border-color: #03A9F4;
    }
    .dataTables_wrapper .dataTables_paginate .paginate_button:hover{
        background: none;
    }
    .dataTables_wrapper .dataTables_paginate .paginate_button.current{
        background-color: #03A9F4;
        color: white !important;
    }
    /* Pagination Styles */
    #issue-table_paginate ul.pagination{
        height: 0;
        margin: 0;
    }
    #issue-table_paginate .pagination .paginate_button{
        padding: 0;
        margin: 0;
    }
    #issue-table_paginate .pagination .paginate_button a{
        padding: 10px 15px;
        font-size: 12px;
    }
    .pagination>.active>a {
        background-color: #03A9F4;
        border-color: #03A9F4;
    }
    .pagination>.active>a, .pagination>.active>a:focus, .pagination>.active>a:hover, .pagination>.active>span, .pagination>.active>span:focus, .pagination>.active>span:hover{
        background-color: #03A9F4;
        border-color: #03A9F4 ;
    }
    .pagination>li>a:focus{
        outline: none;
        background-color: #03A9F4;
        border-color: #03A9F4 ;
    }
    .pagination>li>a, .pagination>li>span{
        color: #337AB7;
        background-color: white;
    }
    .pagination>li>a:focus, .pagination>li>a:hover, .pagination>li>span:focus, .pagination>li>span:hover {
        background-color: white;
    }
    div#issue-table_info {
        font-size: 12px;
        margin-left: 15px;
    }
    #issue-table_wrapper #issue-table_paginate .pagination > li.active > a{
        color: white;
    }
    /* Responsive adjustments */
    @media (max-width: 767px) {
        .controls-wrapper {
            flex-direction: column;
            gap: 15px;
        }
        .search-box {
            width: 100%;
        }
        .buttons-wrapper {
            width: 100%;
            justify-content: flex-end;
        }
        .dataTables_wrapper .bottom {
            flex-direction: column-reverse;
            gap: 60px;
        }
    }
    @media (min-width: 768px) {
        .dataTables_wrapper .bottom {
            flex-direction: row;
        }
    }
    @media (max-width: 991px) {
        #issue-table_wrapper #issue-table th {
            text-align: center;
        }
    }
}

#issueEDITForm,
#issueADDForm {
    .phase-field-icon {
        display: none;
    }
    .phase-field-divider {
        max-height: 10px;
        opacity: 0;
    }
}

/*******************************************/
/*       PHASES > EDIT > PHASE FIELD       */
/*******************************************/

.dragging-helper {
    position: absolute;
    width: 136px; 
    height: 52px; 
    background-color: #fff; 
    border: 2px dashed #008cdd; 
    border-radius: 4px;
    padding: 5px;
    box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.1);
}
.phasefield-form {
    width: 100%;
    margin-left: 15px;
}
.phasefield-form .mdl-textfield .phase-field-label {
    margin-bottom: 12px;
}
.phase-field-btn-wrapper .phase-field-parent {
    display: flex;
    gap: 6px;
    align-items: center;
    cursor: grab;
}
.phasefield-form {
    .phase-form-editor-left-nav {
        background: #edf5fd;
        min-width: 320px;
        height: 100%;
        border: 1px solid #80808085;
        max-height: calc(100vh - 170px);
        overflow: scroll;
    }
    #drop-target::-webkit-scrollbar,
    .phase-form-editor-left-nav::-webkit-scrollbar {
        width: 3px;
        height: 0;
        border-radius: 6px;
        transition: width 1s ease;
    }
    #drop-target::-webkit-scrollbar-thumb {
        background-color: #d4d2d2;
    }
    .phase-form-editor-left-nav::-webkit-scrollbar-thumb {
        background-color: #dddcdc;
    }
    #form-phase-fields .drag-btn{
        cursor: grab;
        padding: 18px 0px;
    }
    #form-phase-fields .wrapper-div{
        flex-grow: 1;
        width: 100%;
    }
    #phase-field-form .card-edit-radio,
    #phase-field-form .card-edit-multi-select,
    #phase-field-form .rich-text {
        padding: 12px 0 0 0;
    }
    .phase-form-editor-left-nav .phase-field-icon {
        color: #808080 !important;
        font-size: 20px;
        width: 20px;
        height: 20px;
    }
    #drop-target .break-line {
        width: 110%;
        margin-left: -35px;
    }
    #drop-target {
        margin-left: 35px;
        max-height: calc(100vh - 170px);
        overflow: scroll;
    }
    #drop-target .phase-form-editor-icon {
        font-size: 34px;
        width: 34px;
        height: 34px;
    }
    #drop-target .phase-field-icon {
        font-size: 20px;
        width: 20px;
        height: 20px;
        overflow: hidden;
    }
    .bootstrap-tagsinput {
        width: 100%;
    }
    .phase-field-btn-wrapper .phase-field-parent {
        border-radius: 4px;
        padding: 13px 10px;
        display: flex;
        gap: 6px;
        align-items: center;
        color: #001219;
        cursor: grab;
        box-shadow: 1px 1px 1px #00000010;
    }
    .phasefields-grid {
        display: grid;
        grid-template-columns: 48% 48%;
        gap: 12px;
    }
    .phasefield-form #phase-field-form{
        background: #fff;
    }
    #form-phase-fields .material-symbols-outlined {
        position: relative;
        top: 4px;
        left: -2px;
    }
    #form-phase-fields .row.phasefield{
        margin-right: 2px;
    }
    #form-phase-fields .phasefield .phasefield-border-block {
        border: 2px solid #fff;
        padding-left: 5px;
    }
    #form-phase-fields .phasefield .phasefield-border-block:hover {
        border: 2px dashed #03A9F4;
        border-radius: 5px;
        transition: all .1s;
    }
    .phase-form .no-phase-fields-block {
        margin-top: 250px;
        color: #001219;
    }
    .phase-form .no-phase-field-form-text {
        font-size: 20px;
    }
    .phase-form .no-phase-fields-block .file-open-icon {
        font-size: 44px;
        color: #808080;
    }
    #phasefield-form-wrapper{
        background: transparent !important;
        width: 96%;
    }
    #form-phase-fields .wrapper-div .phasefield-options{
        position: absolute;
        top: 16px;
        right: 18px;
    }
    #drop-target .mdl-textfield {
        padding: 12px 0 15px 0;
    }
    .row.phasefield .phasefield-border-block:hover .custom-label-LOW{
        transition: all .3s;
        transform: translateX(-70px);
    }
    .phase-field-divider {
        padding: 10px 0;
        max-height: 20px;
        opacity: 0;
        transition: max-height 0.5s ease, opacity 0.4s ease;
    }
    .phase-field-divider:hover {
        transition: opacity .8s;
        opacity: .6;
        max-height: 40px;
        transition: max-height 0.5s ease, opacity 0.4s ease;
    }
    .phase-field-divider .phase-field-divider-text::after,
    .phase-field-divider .phase-field-divider-text::before {
        content: '';
        position: absolute;
        top: 20px;
        border-bottom: 2px dashed #03A9F4;
    }
    .phase-field-divider .phase-field-divider-text::before{
        width: calc(50% - 95px);
        left: 15px;
    }
    .phase-field-divider .phase-field-divider-text::after{
        width: calc(50% - 85px);
        right: 0px;
    }
    .drop-placeholder{
        border:2px dashed #008cdd;
        border-radius:5px;
        height: 80px;
        margin: 5px;
        background:#ffffff;
        display: none;
    }
    #form-phase-fields{
        padding-bottom: 30px;
        padding-top: 10px;
    }
    #form-phase-fields .phasefield > div:hover .resize-grip {
        opacity: 1;
    }
    #form-phase-fields .phasefield > div:hover .phasefield .resize-grip {
        opacity: 0;
        pointer-events: none;
    } 
    #form-phase-fields .phasefield > div .resize-grip {
        content: '';
        position: absolute;
        width: 60px;
        height: 8px;
        border: 2px solid #808080;
        background: #808080;
        border-radius: 4px;
        rotate: 90deg;
        right: -31px;
        top: 50%;
        opacity: 0;
    }
    #form-phase-fields .resize-grip:hover {
        cursor: w-resize;
    }
}
#phasefieldEDITForm,
#phase-field-form {
    .mdl-textfield__input,
    .input-group .mdl-textfield__input {
        height: 36px;
        padding: 6px 12px;
        border: 1px solid #808080;
        border-radius: 4px;
        font-size: 1rem;
        color: #333;
        box-sizing: border-box;
        background-color: #fff;
        outline: none;
        transition: border-color 0.2s ease;
    }
    .input-group .mdl-textfield__input.formula-field {
        padding-left: 25px;
    }
    .phase-field-category {
        margin-bottom: 16px;
    }
    .select2-container--default .select2-selection--single .select2-selection__arrow{
        height: 36px;
    }
    #field-extra-options .extra-phase-field-label {
        margin: 14px 0 12px 0;
    }
    #field-extra-options .desc-phase-field-label {
        margin: 14px 0 10px 0;
    }
    .phase-field-label {
        margin: 6px 0 10px 0;
    }
    .mdl-radio {
        margin: 0;
    }
    .is-tag-label {
        margin-bottom: 0;
    }
    #field-extra-options .mdl-textfield:not(.is-dirty) .phase-field-label{
        padding-left: 5px;
    }
    #field-extra-options .is-focused:not(.is-dirty)  .phase-field-label{
        padding-left: 0;
    }
    .card-edit-multi-select{
        padding-top: 20px;
    }
    .select2-selection--single, .dropdown-select, select.form-control {
        height: 36px;
        padding: 6px 12px;
        border: 1px solid #808080;
        border-radius: 4px;
        background-color: #fff;
        display: flex;
        align-items: center;
        box-shadow: none;
        transition: border-color 0.15s ease-in-out;
        width: 100%;
        font-size: 16px;
        padding-left: 5px;
    }
    .uploadifive-button{
        text-align: left !important;
        padding-left: 10px;
        width: 100% !important;
        border-color: #a3a0a0 !important;
    }
    .uploadifive-button input{
        width: 100%;
    }
    .uploadifive-button .custom-upload-placeholder{
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        pointer-events: none;
        font-size: 0.857rem;
        border-color: #B2B9C4;
        text-align: center;
        line-height: 2.4;
        z-index: 1;
    }
}

@media only screen and (max-width: 479px){
    #phase-field-form .phase-form-editor-left-nav{
        display: none;
    }
    #drop-target .break-line{
        width: 125%;
    }
    #phase-field-form #form-phase-fields{
        padding-right: 15px;
    }
    #phase-field-form #drop-target{
        width: 95%;
        padding-right: 0 !important;
        padding-left: 6px;
        margin-left: 0;
    }
}

/*******************************************************/
/*   PHASES > EDIT > PHASE FIELD - RIGHT PANEL MODAL   */
/*******************************************************/

.modal-dialog.modal-width-right-large {
    margin-top: 0;
    margin-right: 0;
    max-width: 406px;
    margin-bottom: 0;
    height: 100%;
}
.modal-dialog.modal-width-right-large .modal-close-icon,
.issue-field .no-phase-fields-block {
    display: none;
}
.modal-dialog.modal-width-right-large .modal-content {
    max-height: 100vh !important;
    border-radius: 0 !important;
}
.modal-dialog.modal-width-right-large .modal-header {
    background: #03A9F4 !important;
}
.modal-dialog.modal-width-right-large .modal-title {
    margin-right: 25px;
}
.modal-dialog.modal-width-right-large .modal-title,
.modal-dialog.modal-width-right-large .modal-close-icon .material-icons {
    color: #ffffff;
}
.modal-dialog.modal-width-right-large .modal-close-icon .material-icons {
    padding-top: 10px !important;
}
.modal-dialog.modal-width-right-large .modal-body .phase-field-record .phase-field-type-wrapper,
.modal-dialog.modal-width-right-large .modal-body #phasefieldEDITForm .row .phase-field-type-wrapper,
.modal-dialog.modal-width-right-large .modal-body #phasefieldEDITForm #is-mandatory-block{
    margin-left: 0;
    margin-bottom: 0;
    width: 100% !important;
    padding-left: 5px;
}
.modal-dialog.modal-width-right-large .modal-body #phasefieldEDITForm .radio-inline {
    padding-left: 0;
}
.modal-dialog.modal-width-right-large .modal-body .phase-field-record .close-button,
.modal-dialog.modal-width-right-large .modal-body .phase-field-record #ajax-save-button {
    margin-left: 5px;
}
.modal-dialog.modal-width-right-large .sticky-modal-close-icon{
    display: block;
}
.modal.fade .modal-dialog.modal-width-right-large {
  transform: translateX(0%);
}
/* Phase description custom tooltip */
.issue-heading .phase-info-icon {
	position: relative;
    display: inline-block;
}
.issue-heading .custom-tooltip .phase-tooltip-content {
	display: none;
	min-width: 400px;
	max-width: 500px;
	height: auto;
	max-height: 250px;
	overflow-y: auto;
	background-color: #262F3D;
	color: white;
	text-align: left;
	box-sizing: border-box;
	border-radius: 6px;
	padding: 8px 8px;
	position: absolute;
	z-index: 1000;
	transition: opacity 0.2s ease;
}
.issue-heading .phase-info-icon .tooltip-arrow {
	position: absolute;
	display: none;
	width: 15px;
	height: 15px;
	background: transparent;
	transform: rotate(45deg);
}
.issue-heading .phase-info-icon:hover + .custom-tooltip .phase-tooltip-content,
.issue-heading .phase-info-icon:hover .tooltip-arrow,
.issue-heading .custom-tooltip:hover .phase-tooltip-content {
	display: block;
}
.custom-tooltip .phase-tooltip-content::-webkit-scrollbar {
    width: 3px;
    border-radius: 10px;
    transition: width 1s ease;
}
.custom-tooltip .phase-tooltip-content::-webkit-scrollbar-thumb {
  background-color: grey;
  border-radius: 10px;
}
.issue-heading .custom-tooltip span, 
.issue-heading .custom-tooltip p,
.issue-heading .custom-tooltip p span {
	padding: 10px !important;
	color: white !important;
}
.issue-heading .custom-tooltip p strong {
    color: white !important;
    margin: 0;
}
.issue-heading .custom-tooltip table {
    background: none;
}
/* ******************************************* */
/*                 Manage SLAs                 */
/* ******************************************* */

.sla-details .sla-label-heading #manage-sla-label {
    font-weight: 500;
    font-size: 1.4em;
}
.sla-details .sla-dashboard .dark-text {
    font-size: 1.3rem;
    color: #34495ECC !important;
    font-weight: 500;
}
.sla-details .sla-table {
    height: auto;
    max-height: 400px;
    overflow: auto;
    margin-top: 25px;
    padding-left: 0;
    padding-right: 0;
    border: 1px solid #E3E3E3;
    border-radius: 8px;
    margin-left: 3.5%;
}
.sla-details .sla-table #manage-sla-table {
    width: 100%;
    table-layout: auto;
    border-collapse: collapse;
    border-spacing: 0;
    overflow: hidden;
}
.sla-details .sla-table #manage-sla-table .sla-table-head .sla-table-row .sla-table-title {
    font-size: 0.75rem;
    font-weight: 500;
    color: #34495E;
    padding: 16px 8px;
    border-bottom: 1px solid #E3E3E3;
}
.sla-details .sla-table #manage-sla-table .sla-table-body .sla-table-row .sla-table-content,
.sla-details .sla-table #manage-sla-table .sla-table-head .sla-table-row .sla-table-title {
    border: 1px solid #E3E3E3;
    border-right: none;
    padding: 8px 10px;
    width: auto;
}
.sla-details .sla-table #manage-sla-table .sla-table-body .sla-table-row .sla-table-content:first-child,
.sla-details .sla-table #manage-sla-table .sla-table-head .sla-table-row .sla-table-title:first-child {
    border-left: none; 
    border-bottom: none;
}
.sla-details .sla-table #manage-sla-table .sla-table-body .sla-table-row .sla-table-content:last-child,
.sla-details .sla-table #manage-sla-table .sla-table-head .sla-table-row .sla-table-title:last-child {
    border-right: none;
}
.sla-details .sla-table #manage-sla-table .sla-table-body .sla-table-row .sla-table-content:not(:first-child) {
    background-color: #FCFCFD;
}
.sla-details .sla-table #manage-sla-table .sla-table-body .sla-table-row .sla-table-content:first-child{
    background-color: #ffffff;
}
 .sla-input .input-group-addon-suffix {
    border-bottom: none !important;
    border-radius: 0 !important;
 }
 .sla-input .input-group-addon {
    border-radius: 0 !important;
    padding: 7px 12px;
 }
 .sla-input {
    display: flex;
    align-items: center;
    width: max-content;
    border: 1px solid #D6D7D9;
    border-radius: 4px;
    overflow: hidden;
    height: 30px;
}
.sla-input .form-primary-input {
    background: white;
    padding: 4px 8px;
    text-align: right;
    border-top-left-radius: 2px;
    border-bottom-left-radius: 2px;
    margin-top: 0;
    font-size: 0.8rem;
    outline: none;
    border: none;
    width: 55px;
    height: 30px;
    outline: none;
    text-align: right;
    font-size: 0.8rem;
    box-sizing: border-box;
}
.sla-input .input-group-addon-suffix {
    background: #F4F5F7;
    padding: 4px 8px !important;
    font-size: 0.8rem;
    height: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-left: 1px solid #D6D7D9;
    color: #555;
    width: 30px;
}
.sla-details .sla-status {
    text-align: center;
    padding: 0 10px; 
    margin-top: 25px;
    margin-left: 25px;
}
.sla-details .sla-status .sla-status-content {
    font-size: 1rem;
    font-weight: 500;
}
#manage-sla-table .sla-table-head .sla-table-row .sla-table-title i.material-icons,
.sla-details .sla-status .sla-status-content i.material-icons {
    cursor: pointer;
    font-size: 1.3rem;
    color: #34495E1A;
    opacity: 0.3;
    margin-left: 2px;
}
.sla-details .sla-status .sla-status-content .sla-status-title {
    color: #8C8C8C;
    text-transform: uppercase;
}
#sla-tab .tooltip .tooltip-inner,
.sla-table .tooltip .tooltip-inner {
    background-color: #2b2f38;
    color: #fff;
}
#sla-tab .tooltip .tooltip-inner,
.sla-table .tooltip .tooltip-inner,
.sla-tooltip .tooltip-inner {
    padding: 10px 14px;
    font-size: 1rem;
    text-align: left;
    border-radius: 5px;
    box-shadow: 0 2px 8px rgba(0,0,0,0.25);
    max-width: 350px;
}
.sla-tooltip .tooltip-inner {
    background: #ffffff;
    color: #555;
    font-weight: 500;
}
.sla-tooltip.top .tooltip-arrow {
    border-top-color: #ffffff !important;
}
.sla-tips {
    margin-top: 20px;
    margin-bottom: 20px;
}
.sla-tips .tips {
    font-weight: 400;
    font-style: normal;
    color: #9A9A9A;
    font-size: 1rem;
}
.sla-tips .tips strong {
    color: #34495E;
    font-weight: 500;
}
#manage-sla-table .sla-table-content.sla-phase-row  {
    position: relative;
    vertical-align: middle;
    padding: 15px 10px;
    overflow: visible;
}
#manage-sla-table .sla-table-content.sla-phase-row .phase-count {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    width: 26px;
    height: 26px;
    background-color: #EBF9FF;
    color: #29B6F6;
    border-radius: 50%;
    font-weight: 500;
    font-size: 0.7rem;
    z-index: 2;
    position: relative;
    margin-right: 12px;
}
#manage-sla-table .sla-table-content.sla-phase-row .phase-count::after {
    content: "";
    position: absolute;
    top:100%;
    left: 50%;
    width: 2px;
    transform: translateX(-50%);
    height: calc(100% + 10px);
    background-color: #A7E1FB;
    z-index: 1;
}
#manage-sla-table .sla-table-row:last-child .sla-table-content.sla-phase-row .phase-count::after {
    display: none;
}
#manage-sla-table .sla-table-content.sla-phase-row .phase-name {
    color: #34495E;
    font-weight: 400;
    font-size: 1rem;
    text-align: left;
}
.sla-table::-webkit-scrollbar {
    width: 0px;
    height: 0;
    border-radius: 10px;
    color: #E3E3E3;
    transition: width 1s ease;
}
.sla-border {
    position: relative;
}
.sla-border .sla-badge{
    position: absolute;
    left: 0;
    top: 0;
    width: 8px;
    height: 100%;
}
.sla-input input:read-only {
    pointer-events: none;
    color: transparent !important;
}
.sla-table .sla-breach {
    width: 16px;
    height: 16px;
    border-radius: 4px;
    margin-right: 4px;
}
.sla-table #sla-on-track {
    background-color: white;
    border: 1px solid #E5E5E5;
}
.sla-table #sla-warning {
    background-color: #FF8D28;
    border-radius: 1px solid #FF8D28;
}
.sla-table #sla-breached {
    background-color: #FF383C;
    border-radius: 1px solid #FF383C;
}

/* override bootstrap tab styles for project settings tabs */
#project-settings .tab-list {
	padding-bottom: 0 !important;
}
#project-settings .tab-list .tab-list-a {
	font-size: 1rem;
	color: #262F3D;
}
#project-settings .tab-list.active .tab-list-a {
	background: none;
	color: #29b6f6 !important;
}
#project-settings .nav-tabs>.tab-list.active>.tab-list-a:hover {
    background: none;
    color: none;
    border: none !important;
    border-bottom-color: none;
}
#project-settings .nav-tabs>.tab-list.active>.tab-list-a, 
#project-settings .nav-tabs>.tab-list.active>.tab-list-a:focus, 
.project-setting-tab .nav-tabs>.tab-list.active>.tab-list-a:hover {
    border: none !important;
    border-bottom: none !important;
    background: none;
}
#project-settings .nav>.tab-list>a:focus, 
#project-settings .nav>.tab-list>.tab-list-a:hover {
    background: transparent !important;
    opacity: 1 !important;
    border: none !important;
}
#project-settings {
    padding-left: 0;
}