/*     Navbar background     */
.pcoded-navbar {
	background: #033a2a
}
/*     #Active item background     */
.pcoded-navbar .pcoded-inner-navbar > li.active > a, .pcoded-navbar .pcoded-inner-navbar > li.pcoded-trigger > a {
	background: #28a14c
}
.pcoded-navbar .pcoded-submenu {
	background: #28a14c;
}
/*     MISSION Statement SETTINGS     */The little color to the left of the active item
.pcoded-navbar .pcoded-inner-navbar > li.active::after, .pcoded-navbar .pcoded-inner-navbar > li.pcoded-trigger::after {
	background-color: #9bce7f;
}
/*     change the background of the icon at the top     */
.b-brand .b-bg {
	background: linear-gradient(-135deg, #000 0%, #000 100%);
}
/*     background of the top of navbar     */
.navbar-brand {
	background: #000
}
/*     link color     */
.pcoded-navbar a {
	color: #e8edf7;
}
.pcoded-navbar .pcoded-inner-navbar li.active > a, .pcoded-navbar .pcoded-inner-navbar li:focus > a, .pcoded-navbar .pcoded-inner-navbar li:hover > a {
	/*color: #1dc4e9;*/
	color: #0e1111;
}
.pcoded-navbar .pcoded-menu-caption {
	color: #fff;
}




/*     Header at small screen size     */
@media only screen and (max-width: 991px) {
	.pcoded-header {
		background: #033a2a;
	}
}


/*     Change feather icon colors     */
.icon-alert-octagon::before {
  color: red;
}
.icon-check-circle::before {
  color: green;
}

.card-containerlist {
	padding-top:0 !important;
}



.alerts_tbody {
	display: table-row-group;
}
.alerts_tbody tr.active {
	background-color: lightgrey;
}


.pcoded-header .dropdown .profile-notification .pro-head {
	background-color: #4ba547;
}

.img-icon {
	height: 30px;
}

body {
	font-family: Roboto;
	color: #000;
}

/*     Progress Bar Themes     */
.progress-recycle-theme{
	background: #4BA547;
}

.progress-trash-theme{
 	background: #000
}


/*     Button Colar scheme    */
  .btn-outline-primary {
    color: Black;
    background-color: transparent;
    background-image: none;
    border-color: lightgrey;
}
  .btn-outline-primary:hover {
    color: White;
    background-color: #4ba547;
    background-image: none;
    border-color: #4ba547;
}
	.show > .btn-outline-primary.dropdown-toggle {
	  color: #fff;
	  background-color: #4ba547;
	  border-color: #4ba547;
}

 .btn-primary-mymatr {
 		color: #fff;
	  background-color: #4ba547;
	  border-color: #4ba547;
 }
  .btn-primary-mymatr a {
 		color: #fff;
 }
  .btn-primary-mymatr:hover {
    opacity: .8;
	}


.page-item.active .page-link {
  color: #fff;
  background-color: #4ba547;
  border-color: #4ba547;
}

.page-item .page-link {
  color: #000;
}










/* STuff */
.container-list-wrapper {
	border-radius: 3px;
	border: 1px solid #DDDDDE;
	background: #E7E7E7;
	max-height: 500px;
	overflow: scroll;
	padding: 8px !important;
	padding-right: 16px !important;
}


.container-list-row{
  margin: 0;
  margin-bottom: 15px;
  background-color:#fff;
  border-radius: 5px;
  padding: 5px;
  display: flex;
	padding: 16px;
	flex-direction: column;
	align-items: flex-start;
	gap: 12px;
	align-self: stretch;
}
.container-list-row-header {
	margin-bottom: 12px;
}

.container-text-24{
	color: #000;
	font-family: Roboto;
	font-size: 24px;
	font-style: normal;
	font-weight: 500;
	line-height: normal;
	
}
.container-text-20{
	color: #000;
	font-family: Roboto;
	font-size: 20px;
	font-style: normal;
	font-weight: 700;
	line-height: normal;
	
}
.container-text-20l{
	color: #000;
	font-family: Roboto;
	font-size: 20px;
	font-style: normal;
	font-weight: 500;
	line-height: normal;
	
}
.vertical-bar {
	border-right: 1px solid #D9D9D9;
	margin-left: 8px;
	margin-right: 8px;
	height: 2em;

}
.container-text-16{
	color: #000;
	font-family: Roboto;
	font-size: 16px;
	font-style: normal;
	font-weight: 400;
	line-height: normal;
}
.container-text-16h{
	color: #000;
	font-family: Roboto;
	font-size: 16px;
	font-style: normal;
	font-weight: 700;
	line-height: normal;
}
.container-text-12{
	color: #000;
	font-family: Roboto;
	font-size: 12px;
	font-style: normal;
	font-weight: 500;
	line-height: normal;
}
.container-text-12h{
	color: #000;
	font-family: Roboto;
	font-size: 12px;
	font-style: normal;
	font-weight: 500;
	line-height: normal;
}
.offline {
	border-radius: 2px;
	border: 1px solid #F8B8B8;
	background: #FBD7D7;
	padding: 4px 8px;
}
.online {
	border-radius: 2px;
	border: 1px solid #92C590;
	background: #D6F0DE;
	padding: 4px 8px;
}
.alert-list-wrapper {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 16px;
	padding: 16px !important;
	max-height: 615px;
	overflow: scroll;
}

.alert-list-row{
	display: flex;
	padding: 8px 16px;
	align-items: center;
	gap: 16px;
	justify-content: space-between;
	align-items: flex-start;
	flex-shrink: 0;
	width: 100%;
	border-top: 1px solid #ADADAD;
}
.datepicker{
  border: 1px solid lightgrey;
  border-radius: .25rem;
  padding: 10px 20px;
  font-size: 14px;
  margin-bottom: 5px;
  margin-right: 10px;
}
.impact{
  min-width: 400px;
  display: flex;
	height: 141px;
	padding: 16px;
	flex-direction: column;
	align-items: flex-start;
	gap: 16px;
	flex-basis: 33%;
	border: 1px solid #DDDDDE;
}

.impact-header {
	height: 23px;
	flex-shrink: 0;
	align-self: stretch;
	color: #000;
	font-family: Roboto;
	font-size: 20px;
	font-style: normal;
	font-weight: 500;
	line-height: normal;
}

.impact-data {
align-self: stretch;
color: #000;
font-family: Roboto;
font-size: 32px;
font-style: normal;
font-weight: 700;
line-height: normal;
}


@media screen 
and (max-width: 400px){
  .impact {
    min-width: 100%;
  }

}
.card-header-containers{
	display: flex;
	align-items: baseline;
	gap: 16px;
	align-self: stretch;
	flex-wrap: wrap;
}
.card-header-title{
	color: #000;
	font-family: Roboto;
	font-size: 32px;
	font-style: normal;
	font-weight: 700;
	line-height: normal;

}

.card-header-link{
	color: var(--Primary-Green, #4BA547);
	font-family: Roboto;
	font-size: 16px;
	font-style: normal;
	font-weight: 700;
	line-height: normal;
	flex-grow: 2;
}
.card-header-link:hover {
	color: var(--Primary-Green, #4BA547);
}