@font-face {
  font-family: BrandonGrotesqueLight;
  src: url(../fonts/brandon-grotesque-light.otf) format('opentype');
}

@font-face {
  font-family: BrandonGrotesqueBlack;
  src: url(../fonts/brandon-grotesque-black.otf) format('opentype');
}

@font-face {
  font-family: FontAwesome;
  src: url(../fonts/fa-solid-900.ttf) format('truetype');
}

body {
	font-family: BrandonGrotesqueLight;
}

section.login {
    padding: 14px 0px;
    background: linear-gradient(
-90deg
, #edf8ec 50%, rgb(255 255 255) 50%);
}

.sidebar__navbar.active.position-absolute.close-side {
	z-index: 111;
}

/* SIDEBAR SCROLL */
/*::-webkit-scrollbar {
    background-color: #d8d8d8;
    width: 13px;
    height: 10px;
}
::-webkit-scrollbar-track {
    background-color:#fff;
}
::-webkit-scrollbar-track:hover {
    background-color:#f4f4f4;
}*/

/* scrollbar itself */
/*::-webkit-scrollbar-thumb {
    background-color: #d8d8d8;
    border-radius: 16px;
    border: 5px solid #fff;
}
::-webkit-scrollbar-thumb:hover {
    background-color:#a0a0a5;
    border:4px solid #f4f4f4;
}*/


/* FOR SIDEMENU */

.sidebar__navbar::-webkit-scrollbar {
    background-color: #d8d8d8;
    width: 13px;
    height: 10px;
}
.sidebar__navbar::-webkit-scrollbar-track {
    background-color:#fff;
}
.sidebar__navbar::-webkit-scrollbar-track:hover {
    background-color:#f4f4f4;
}

/* scrollbar itself */
.sidebar__navbar::-webkit-scrollbar-thumb {
    background-color: #d8d8d8;
    border-radius: 16px;
    border: 5px solid #fff;
}
.sidebar__navbar::-webkit-scrollbar-thumb:hover {
    background-color:#a0a0a5;
    border:4px solid #f4f4f4;
}


/* ENDS */
.panel > a.collapsed:before {
    float: right !important;
    content: "\f067";
    font-family: FontAwesome;
}

.panel > a:before {
    float: right !important;
    font-family: FontAwesome;
    content: "\f068";
    padding-right: 5px;
}

/* set button(top and bottom of the scrollbar) */
.sidebar__navbar::-webkit-scrollbar-button {display:none}

.image {
    background-image: url('../images/login-bg.png');
    background-size: contain;
    background-repeat: no-repeat;
    background-position: 0% 50%;
}

.forgot-password .image {
    background-image: url(../images/forgot-password.png);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: 0% 40%;
}

.main-content {
    background-color: #edf8ec;
    padding: 35px 190px 35px 90px;
}

section.forgot-password {
    min-height: calc(100vH - 52px);
}

section.forgot-password .main-content {
    background-color: #edf8ec;
    padding: 35px 190px 35px 90px;
    height: 706px;
}

.login-heading h2 {
    font-size: 35px;
    color: #000000;
    font-weight: 600;
    text-transform: capitalize;
}

.input-fields.form label {
    font-size: 20px;
}

.input-fields.form .form-control {
    border-radius: 100px;
    border: 1px solid #e3e1ed;
    height: calc(2.5em + .75rem + -2px);
    color: #373737;
    padding: 8px 25px;
}

.input-fields.form .form-control:focus {
    box-shadow: 0 0 18px 3px rgb(80 184 71 / 19%);
    transition: all .5s ease-in;
}

.form-control:focus {
    box-shadow: 0 0 18px 3px rgb(80 184 71 / 19%);
    transition: all .5s ease-in;
    border-color: transparent;
}


.input-fields.form .form-group i {
    position: relative;
    top: -34px;
    left: 90%;
    color: #50b847;
}

.forgot-password .input-fields.form .form-group i {
    position: relative;
    top: -36px;
    right: -90%;
    color: #50b847;
}

.input-fields.form .form-group .text-danger {
    color: #ff0018 !important;
    font-size: 13px;
}

.input-fields.form .center i {
    /* margin: 0px 0px 0px 8px; */
    font-size: 16px;
    position: relative;
    top: 2px;
}

.input-fields.form .forgot-password .fr-psd {
    color: #50b847;
    font-size: 16px;
    text-transform: capitalize;
    font-weight: 600;
    text-decoration: none;
}

.input-fields.form .forgot-password .fr-psd:hover {
    transition: .3s ease-in;
    color: #0f6d07;
}


.btn.hover-filled-slide-left::before {
    top: 0;
    bottom: 0;
    left: 0;
    height: 100%;
    width: 100%;
    background-color: rgb(28, 31, 30);
    transition: 0.3s ease-out;
}

.input-fields.form .button-2 {
    position: absolute;
    left: 50%;
    display: inline-block;
    width: 180px;
    height: 50px;
    background-color: #50b847;
    text-align: center;
    cursor: pointer;
    position: relative;
    box-sizing: border-box;
    overflow: hidden;
    border-radius: 50px;
    color: #fff;
    padding: 0px;
}
.input-fields.form .button-2 a {
  font-size:16px;
  color:#34495e;
  text-decoration:none;
  text-transform:uppercase;
  line-height:50px;
  transition:all .5s ease;
  z-index:2;
  position:relative;
}
.input-fields.form .eff-2 {
    width: 180px;
    height: 50px;
    top: -50px;
    background: #ffffff;
    position: absolute;
    transition: all .5s ease;
    z-index: 1;
}
.input-fields.form .button-2 a {
    font-size: 16px;
    color: #ffffff;
    text-decoration: none;
    text-transform: capitalize;
    line-height: 40px;
    transition: all .5s ease;
    z-index: 2;
    position: relative;
    background-color: transparent;
    border-color: transparent;
    padding: 0;
}
.input-fields.form .button-2 a .btn-primary {
    background-color: transparent;
    border-color: transparent;
    padding-top: 10px;
    padding-left: 25px;
    padding-bottom: 12px;
    padding-right: 10px;
}
.input-fields.form .button-2:hover .eff-2 {
  top:0;
}
.input-fields.form .button-2:hover a {
    color: #50b847;
}
.input-fields.form .button-2:hover a .btn.btn-primary {
    color: #50b847;
}

.input-fields.form .btn-primary:hover {
    background-color: transparent;
    border-color: transparent;
    box-shadow: none !important;
}

.input-fields.form .center {
    transform: translate(-50%, -50%);
    margin-top: 60px;
}

.footer-details {
    position: relative;
    top: 60px;
}

/* ADD PAGE CSS */
 .ul__list--inline {
	 list-style: none;
	 padding: 0;
	 margin: 0;
}
 .ul__list--inline > li {
	 display: inline-block;
}
 .ul__list {
	 list-style: none;
	 padding: 0;
	 margin: 0;
}
.sidebar__navbar {
    /*height: 100%;*/
    position: fixed;
    background-color: #ffffff;
    /* box-shadow: 0px 0px 20px 1px #cacaca; */
    width: 0;
    left: -100%;
    z-index: 999;
    transition: 0.5s ease;
}
 @media screen and (max-width: 768px) {
	 .sidebar__navbar div {
		 z-index: 99;
	}
}
 @media screen and (max-width: 768px) {
	 .sidebar__navbar span {
		 /*position: fixed;*/
		 left: -100%;
		 transition: 0.5s ease;
	}
}

 @media screen and (max-width: 768px) {
		.sidebar__navbar.active span {
    		content: "";
    		position: fixed;
    		width: 100%;
    		height: 100%;
    		left: 0;
    		top: 0;
    		z-index: 40;
    		/*background-color: rgb(8 8 8 / 12%);*/
		}
}
 .sidebar__content {
	 transition: 0.5s ease;
}
.topbar {
	background-color: #fff;
	/*box-shadow: 0px 0px 20px 1px #cacaca;*/
}
.sidebar__list--menu {
	 list-style: none;
	 margin: 0;
	 padding: 0;
}
.sidebar__list--menu li {
	 margin-bottom: 10px;
}
.sidebar__list--menu li a {
    padding: 15px 20px;
    color: #000;
    width: 100%;
    font-size: 15px;
    text-decoration: none;
    display: block;
}
.sidebar__list--menu li a.active {
     background-color: #fff 26;
	 border-radius: 33px;
}
.sidebar__list--menu li a:hover {
    color: #50b847;
    background-color: #dcf1da;
    border-radius: 50px;
}
.sidebar__navbar.active ~ .sidebar__content {
	margin-left: 280px;
	transition: 0.5s ease;
}

.sidebar__navbar.active ~ .footer {
	margin-left: 280px;
	transition: 0.5s ease;
}

.sidebar__navbar.active {
    width: 280px !important;
    left: 0;
    overflow: auto;
    height: 100%;
}

/*.sidebar__content {
	 margin-left: 280px;
	 transition: 0.5s ease;
}*/

/*.nav-link {
    padding: 15px 20px !important;
    color: #000 !important;
    display: inline-block;
    width: 100%;
    font-size: 15px;
}

.nav-link i {
    color: #50b847;
}

.nav-link:hover {
    color: #50b847 !important;
    background-color: #dcf1da;
    border-radius: 50px;
}

.content-wrapper {
    /* display: flex; */
    /* align-items: center; */
    /*justify-content: center;
    padding: 2% 3%;
    background-color: #ebf5ea;
    min-height: calc(100vH - 72px);
}

.navbar-brand img {
	width: 260px;
}

.footer {*/
    /* position: absolute; */
    /* bottom: 0; */
    /*width: 100%;*/
    /* height: 3.5rem; */
    /*line-height: 3.5rem;
    background-color: #fff;
    font-size: 13px;*/
}

.nav-link:hover {
  transition: all 0.4s;
}

.nav-link-collapse:after {
  float: right;
  content: '\f067';
  font-family: 'FontAwesome';
}

.nav-link-show:after {
  float: right;
  content: '\f068';
  font-family: 'FontAwesome';
}

.nav-item ul.nav-second-level {
    padding-left: 0;
    list-style: none;
}

.nav-item ul.nav-second-level > .nav-item {
  padding-left: 20px;
}

.nav-link-collapse:after {
    float: right;
    content: '\f067';
    font-family: 'FontAwesome';
}

@media (min-width: 992px) {
  	.sidenav {
    	position: absolute;
    	top: 0;
    	left: 0;
    	width: 280px;
    	height: calc(100vh - 82px);
    	margin-top: 82px;
    	background: #fff;
    	box-sizing: border-box;
    	padding: 0px 15px;
	}

  .navbar-expand-lg .sidenav {
    flex-direction: column;
  }

  .content-wrapper {
    margin-left: 280px;
  }

  	/*.footer {
    	width: calc(100% - 280px);
    	margin-left: 280px;
	}*/
}


.nav-link-collapse:after {
    float: right;
    content: '\f067';
    font-family: 'FontAwesome';
}

.card-abst {
	border-radius: 10px;
}

.pending .card-abst {
    background-color: rgb(255 197 112 / 30%);
}

.pending .card-abst .media {
    background-color: #ffc570;
    padding: 12px !important;
}

.approved .card-abst {
    background-color: rgb(118 202 92 / 30%);
}

.approved .card-abst .media {
    background-color: rgb(118 202 92);
    padding: 12px !important;
}

.rejected .card-abst {
    background-color: rgb(229 55 92 / 30%);
}

.rejected .card-abst .media {
    background-color: rgb(229 55 92);
    padding: 13px 16px !important;
}

.suspended .card-abst {
    background-color: rgb(255 219 0 / 30%);
}

.suspended .card-abst .media {
    background-color: rgb(255 219 0);
    padding: 13px 14px !important;
}

.revoked .card-abst {
    background-color: rgb(59 190 242 / 30%);
}

.revoked .card-abst .media {
    background-color: rgb(59 190 242);
    padding: 13px !important;
}

.total .card-abst {
    background-color: rgb(247 107 28 / 30%);
}

.total .card-abst .media {
    background-color: rgb(247 107 28);
}

.wip .card-abst {
    background-color: rgb(255 28 98 / 30%);
}

.wip .card-abst .media {
    background-color: rgb(255 28 98);
}

.aac .card-abst {
    background-color: rgb(128 119 231 / 30%);
}

.aac .card-abst .media {
    background-color: rgb(128 119 231);
}

.comp .card-abst {
    background-color: rgb(6 177 105 / 30%);
}

.comp .card-abst .media {
    background-color: rgb(6 177 105);
    padding: 12px !important;
}

.abr .card-abst {
    background-color: rgb(249 84 76 / 30%);
}

.abr .card-abst .media {
    background-color: rgb(249 84 76);
    padding: 12px !important;
}

.rbr .card-abst {
    background-color: rgb(221 67 157 / 30%);
}

.rbr .card-abst .media {
    background-color: rgb(221 67 157);
    padding: 11px !important;
}

.pwr .card-abst {
    background-color: rgb(250 214 71 / 30%);
}

.pwr .card-abst .media {
    background-color: rgb(250 214 71);
    padding: 14px 0px 0px 15px !important;
}

.ae .card-abst {
    background-color: rgb(240 174 18 / 30%);
}

.ae .card-abst .media {
    background-color: rgb(240 174 18);
}

.total-1 .card-abst {
    background-color: rgb(53 132 108 / 30%);
}

.total-1 .card-abst .media {
    background-color: rgb(53 132 108);
}

.card.boxes .card-abst .media {
    color: #fff;
    width: 45px;
    height: 45px;
    border-radius: 5px;
    font-size: 20px;
    padding: 12px 15px;
}

.card.boxes .card-abst .card-body {
    display: flex;
}


@media screen and (max-width: 768px) {
	 .sidebar__navbar.active ~ .sidebar__content {
		 margin-left: 0;
	}
}
.navabar__menu {
	 width: 40px;
	 height: 40px;
	 color: white;
	 background-color: #50b847;
	 font-size: 18px;
	 border-radius: 5px;
}
.navabar__menu i {
	 position: absolute;
	 top: 50%;
	 left: 50%;
	 transform: translate(-50%, -50%);
}
.navabar__menu:hover, .navabar__menu:focus {
	 color: white;
}
.brand__sidebar {
	 color: #313131;
}
.page__content {
    /* display: flex; */
    /* align-items: center; */
    justify-content: center;
    padding: 2% 3%;
    background-color: #ebf5ea;
    min-height: calc(100vH - 51px);
}

/* DROPDOWN CSS */
.dropdown-menu.show {
    border: transparent;
    background-color: #f9f9f9;
}

.caret {
    display: inline-block;
    width: 0;
    height: 0;
    margin-left: 2px;
    vertical-align: middle;
    border-top: 4px solid;
    border-top: 4px solid\9;
    border-right: 4px solid transparent;
    border-left: 4px solid transparent;
    position: inherit;
}

.heading h2 {
    font-size: 30px;
    color: #50b847;
}

input.form-control {
    height: 48px;
    border-radius: 7px;
    font-size: 15px;
    color: #373737;
    border: 1px solid #c4bfbf;
}

.sidebar__content .card .heading {
    padding: 0px 0px 25px 0px;
}

.sidebar__content .page__content .card {
    border: transparent;
    border-radius: 8px;
    box-shadow: 0px 0px 6px 1px rgb(128 128 128 / 8%);
}

.chck-box .custom-checkbox .custom-control-input:checked ~ .custom-control-label::before {
    background-color: #50b847;
}

/* Radio Button CSS	*/
.radiobuttons .rdio {
	 position: relative;
}
.radiobuttons .rdio input[type="radio"] {
	 opacity: 0;
}
.radiobuttons .rdio label {
	 padding-left: 10px;
	 cursor: pointer;
	 margin-bottom: 7px !important;
}
.radiobuttons .rdio label:before {
	 width: 18px;
	 height: 18px;
	 position: absolute;
	 top: 1px;
	 left: 0;
	 content: '';
	 display: inline-block;
	 -moz-border-radius: 50px;
	 -webkit-border-radius: 50px;
	 border-radius: 50px;
	 border: 1px solid #c4bfbf;
	 background: #fff;
}
.radiobuttons .rdio input[type="radio"] {
	 margin: 0px;
}
.radiobuttons .rdio input[type="radio"]:disabled + label {
	 color: #999;
}
.radiobuttons .rdio input[type="radio"]:disabled + label:before {
	 background-color: #fbc52d;
}
.radiobuttons .rdio input[type="radio"]:checked + label::after {
	 content: '';
	 position: absolute;
	 top: 5px;
	 left: 4px;
	 display: inline-block;
	 font-size: 11px;
	 width: 10px;
	 height: 10px;
	 background-color: #fbc52d;
	 -moz-border-radius: 50px;
	 -webkit-border-radius: 50px;
	 border-radius: 50px;
}
.radiobuttons .rdio-default input[type="radio"]:checked + label:before {
	 border-color: #fbc52d;
}
.radiobuttons .rdio-primary input[type="radio"]:checked + label:before {
	 border-color: #50b847;
}
.radiobuttons .rdio-primary input[type="radio"]:checked + label::after {
	 background-color: #50b847;
}
.radiobuttons .custom-checkbox {
	/*margin-bottom:0px !important;
	*/
}
.radiobuttons .custom-checkbox > [type="checkbox"],
.radiobuttons .custom-checkbox label {
	 -webkit-touch-callout: none;
	 -webkit-user-select: none;
	 -khtml-user-select: none;
	 -moz-user-select: none;
	 -ms-user-select: none;
	 user-select: none;
}
.radiobuttons .custom-checkbox > [type="checkbox"]:not(:checked),
.radiobuttons .custom-checkbox > [type="checkbox"]:checked {
	 position: absolute;
	 left: -9999px;
}
.radiobuttons .custom-checkbox > [type="checkbox"]:not(:checked) + label,
.radiobuttons .custom-checkbox > [type="checkbox"]:checked + label {
	 position: relative;
	 padding-left: 22px;
	 cursor: pointer;
}
.radiobuttons .custom-checkbox > [type="checkbox"]:not(:checked) + label:before,
.radiobuttons .custom-checkbox > [type="checkbox"]:checked + label:before {
	 content: '';
	 position: absolute;
	 left: 0;
	 top: 50%;
	 margin-top: -9px;
	 width: 17px;
	 height: 17px;
	 border: 1px solid #fbc52d;
	 background: #fff;
	 border-radius: 2px;
}
.radiobuttons .custom-checkbox > [type="checkbox"]:not(:checked) + label:after,
.radiobuttons .custom-checkbox > [type="checkbox"]:checked + label:after {
	 font: normal normal normal 12px/1 'Glyphicons Halflings';
	 content: '\e013';
	 position: absolute;
	 top: 50%;
	 margin-top: -7px;
	 left: 2px;
	 color: #fbc52d;
	 xtransition: all 0.2s;
}
.radiobuttons .custom-checkbox > [type="checkbox"]:not(:checked) + label:after {
	 opacity: 0;
	 transform: scale(0);
}
.radiobuttons .custom-checkbox > [type="checkbox"]:checked + label:after {
	 opacity: 1;
	 transform: scale(1);
}
.radiobuttons .custom-checkbox > [type="checkbox"][data-indeterminate] + label:after {
	 content: '\2212';
	 left: 2px;
	 opacity: 1;
	 transform: scale(1);
}
.radiobuttons .custom-checkbox > [type="checkbox"]:disabled:not(:checked) + label:before {
	 box-shadow: none;
	 background-color: #eee;
	 border-color: #eee;
	 cursor: not-allowed;
	 opacity: 1;
	 color: #dadada;
}
.radiobuttons .custom-checkbox > [type="checkbox"]:disabled:checked + label:before {
	 box-shadow: none;
	 background-color: #eee;
	 border-color: #eee;
	 cursor: not-allowed;
	 opacity: 1;
	 color: #fbc52d;
}
.radiobuttons .custom-checkbox > [type="checkbox"]:disabled:checked + label:after {
	 color: #fbc52d;
	 cursor: not-allowed;
}
.radiobuttons .custom-checkbox > [type="checkbox"]:disabled + label {
	 color: #aaa;
	 cursor: not-allowed;
}
.radiobuttons .custom-checkbox > [type="checkbox"]:checked:focus + label:before,
.radiobuttons .custom-checkbox > [type="checkbox"]:not(:checked):focus + label:before {
	 border: 1px solid #fbc52d;
	 box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(102, 175, 233, 0.6);
}
.radiobuttons .custom-checkbox label:hover:before {
	 border: 1px solid #fbc52d !important;
}
.radiobuttons .custom-checkbox [type="checkbox"]:disabled:not(:checked) + label:hover:before,
.radiobuttons .custom-checkbox [type="checkbox"]:disabled:checked + label:hover:before {
	 border: 1px solid #fbc52d !important;
}



/* BUTTONS CSS */

.buttons .btn-primary {
    color: #fff;
    background-color: #50b847;
    border-color: #50b847;
    font-family: 'BRANDONGROTESQUELIGHT';
    border-radius: 50px;
    padding: 8px 35px;
    margin-right: 10px;
    font-size: 16px;
}

.buttons .btn.btn-primary:hover {
    box-shadow: 0px 0px 9px 2px rgb(0 0 0 / 16%);
    background-color: #fff;
    border-color: #fff;
    color: #50b847;
    transition: all .5s ease-in;
    transform: scale(1.05);
}

.buttons .btn.btn-secondary {
    color: #373737;
    background-color: #cacaca;
    border-color: #cacaca;
    font-family: 'BRANDONGROTESQUELIGHT';
    border-radius: 50px;
    padding: 8px 35px;
    font-size: 16px;
    margin-right: 10px;
}
.buttons .btn.btn-danger {
    color: #fff;
    background-color: #ff0000;
    border-color: #ff0000;
    font-family: 'BRANDONGROTESQUELIGHT';
    border-radius: 50px;
    padding: 8px 35px;
    font-size: 16px;
}
.buttons .btn.btn-danger:hover {
    color: #ff0000;
    background-color: #fff;
    border-color: #ff0000;
    transition: all .5s ease-in;
}
.buttons .btn.btn-secondary:hover {
    background-color: #f7f7f7;
    border-color: #f7f7f7;
    color: #191919;
    transition: all .5s ease-in;
}

.footer {
    padding: 15px 40px;
    font-size: 14px;
}

.footer a.c-web {
    color: #50b847;
}


/* TOP PROFILE DROPDOWN	*/
.navbar-list li {
    float: right;
    list-style-type: none;
    position: relative;
}

.navbar-list li > a {
    color: #222260;
    font-size: 15px;
    padding: 0 20px;
    display: block;
    line-height: 50px;
    margin-bottom: 5px;
    text-decoration: none;
}

.profile-header li > a:hover {
    color: #50b847;
    background-color: #dcf1da;
    border-radius: 50px;
}

.navbar-list li > a > i {
	color: #50b847;
}

.navbar-list li > a > img {
    width: 50px;
    height: 50px;
    min-width: 50px;
}

.navbar-list li .caption {
    line-height: 16px;
}

.navbar-list li .caption h6 {
    color: #222260;
    font-weight: normal;
}

.profile-drop .iq-sub-dropdown {
    width: 270px;
    position: absolute;
    top: 100%;
    right: 0;
    left: auto;
    border: none;
    -webkit-animation: fade-in-bottom 0.6s cubic-bezier(0.39, 0.575, 0.565, 1) both;
    animation: fade-in-bottom 0.6s cubic-bezier(0.39, 0.575, 0.565, 1) both;
    -webkit-transform: translateY(100%);
    transform: translateY(100%);
    background: #fff;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
    padding: 0;
    -webkit-border-radius: 8px;
    -moz-border-radius: 8px;
    -ms-border-radius: 8px;
    -o-border-radius: 8px;
    border-radius: 8px;
    box-shadow: 0px 0px 20px 0px #8b8bb736;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}

.navbar-list .card {
    background: linear-gradient(
117.76deg
, rgba(255, 255, 255, 0.7) -7.21%, rgba(255, 255, 255, 0.5) 118.08%);
    backdrop-filter: blur(8px);
    -webkit-border-radius: 8px;
    -moz-border-radius: 8px;
    -ms-border-radius: 8px;
    -o-border-radius: 8px;
    border-radius: 8px;
    margin-bottom: 30px;
    border: 1px solid #ffffff;
    -webkit-box-shadow: 0 10px 20px 0 rgb(0 0 0 / 2%);
    -moz-box-shadow: 0 10px 20px 0 rgba(0, 0, 0, 0.02);
    -ms-box-shadow: 0 10px 20px 0 rgba(0, 0, 0, 0.02);
    -o-box-shadow: 0 10px 20px 0 rgba(0, 0, 0, 0.02);
    box-shadow: 0 10px 20px 0 rgb(0 0 0 / 2%);
}

.profile-header .profile-icon {
    height: 60px;
    width: 60px;
    line-height: 60px;
    font-size: 26px;
}

.nav-item.nav-icon.dropdown.caption-content .dropdown-toggle::after {
	display: none;
}

.profile-header .bg-primary {
    background-color: #50b847 !important;
    color: #fff;
}

.profile-detail h5 a {
    color: #373737;
}

.profile-header .btn-primary {
    color: #fff;
    background-color: #50b847;
    border-color: #50b847;
    font-family: 'BRANDONGROTESQUELIGHT';
    border-radius: 50px;
    padding: 10px 30px;
    margin-right: 10px;
    font-size: 15px;
    margin-top: 13px;
}

.profile-header .btn-primary:hover {
    background-color: #fff;
    color: #50b847;
    transition: all .5s ease-in;
}

.profile-drop .navbar-list {
	padding: 11px 0px;
}

.role-type .dropdown .btn-secondary {
    color: #373737;
    background-color: transparent;
    border-color: transparent;
}

.role-type .dropdown .btn-secondary i {
    color: #50b847;
}

.role-type .dropdown-menu.show {
    border: transparent;
    background-color: #ffffff;
    box-shadow: 0px 2px 3px rgb(128 128 128 / 39%);
}

.role-type .dropdown .btn-secondary.focus, .role-type .dropdown .btn-secondary:focus {
    color: #fff;
    background-color: #5a6268;
    border-color: #545b62;
    box-shadow: none;
    border: 1px solid #d8d8d8 !important;
}

.search-bar .input-group .form-control {
	border-radius: 100px;
    padding: 5px 20px;
}

.search-bar i.fa.fa-search {
    color: #50b847;
}

.table-responsive tbody tr td a {
    text-decoration: none;
    color: #50b847;
    font-weight: 600;
}

.table-responsive tbody tr td a:hover {
	color: #50b847;
	transition: all .5s ease-in;
}

.edit-date-sl i.fa.fa-calendar-alt.cal-icon {
    color: #50b847;
    font-size: 15px;
    position: absolute;
    top: 47px;
    right: 20px;
}

.custom-select {
    height: 48px !important;
    border-radius: 8px;
    border: 1px solid #c4bfbf;
}

.multi-select-drop select {
	height: 86px !important;
    border-radius: 8px;
    border: 1px solid #c4bfbf;
}

.page__content .table-responsive #GridViewSearch_filter {
    float: right;
}


/* MY ACCOUNT CSS */
.sidebar__content .page__content .card {
    border: transparent;
    border-radius: 8px;
    box-shadow: 0px 0px 6px 1px rgb(128 128 128 / 8%);
}

.profile-info {
    display: flex;
    padding: 10px 15px;
}

.profile .profile-photo {
    max-width: 100px;
    position: relative;
    z-index: 1;
    margin-top: -40px;
    margin-right: 10px;
}

.profile-info .profile-details {
    display: flex;
    width: 100%;
}

.profile-details h4 {
    color: #373737!important;
    font-size: 20px;
}

.profile-head .profile-details h4 {
    font-size: 030px;
    font-weight: 600;
}

.photo-content .cover-photo {
    background: url(../images/cover.jpg);
    background-size: cover;
    background-position: center;
    min-height: 250px;
    width: 100%;
}

.profile-details i {
    color: #50b847;
}

.user-details-card {
    display: flex;
}

.profile-page-details .card {
    margin-bottom: 1.875rem;
    background-color: #fff;
    transition: all .5s ease-in-out;
    position: relative;
    border: 0px solid transparent;
    border-radius: 1.375rem;
    box-shadow: 0px 0px 13px 0px rgb(82 63 105 / 5%);
    height: calc(100% - 30px);
}

/*.sidebar__content .page__content .card .view-elements-form .table-responsive {
    height: 500px;
}*/

/* DATEPICKER CSS */
.datepicker table tr td span.active,
.datepicker table tr td span.active:hover,
.datepicker table tr td span.active.disabled,
.datepicker table tr td span.active.disabled:hover {
    background-color: #006dcc;
    background-image: -moz-linear-gradient(top, #0088cc, #0044cc);
    background-image: -ms-linear-gradient(top, #0088cc, #0044cc);
    background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#0088cc), to(#0044cc));
    background-image: -webkit-linear-gradient(top, #50b847, #50b847);
    background-image: -o-linear-gradient(top, #0088cc, #0044cc);
    background-image: linear-gradient(top, #0088cc, #0044cc);
    background-repeat: repeat-x;
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#0088cc', endColorstr='#0044cc', GradientType=0);
    border-color: #0044cc #0044cc #002a80;
    border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
    filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);
    color: #fff;
    text-shadow: 0 -1px 0 rgb(0 0 0 / 25%);
}

.datepicker table tr td.active,
.datepicker table tr td.active:hover,
.datepicker table tr td.active.disabled,
.datepicker table tr td.active.disabled:hover {
    background-color: #006dcc;
    background-image: -moz-linear-gradient(top, #0088cc, #0044cc);
    background-image: -ms-linear-gradient(top, #0088cc, #0044cc);
    background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#0088cc), to(#0044cc));
    background-image: -webkit-linear-gradient(top, #50b847, #50b847);
    background-image: -o-linear-gradient(top, #0088cc, #0044cc);
    background-image: linear-gradient(top, #0088cc, #0044cc);
    background-repeat: repeat-x;
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#0088cc', endColorstr='#0044cc', GradientType=0);
    border-color: #0044cc #0044cc #002a80;
    border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
    filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);
    color: #fff;
    text-shadow: 0 -1px 0 rgb(0 0 0 / 25%);
}

.datepicker table tr td.today,
.datepicker table tr td.today:hover,
.datepicker table tr td.today.disabled,
.datepicker table tr td.today.disabled:hover {
    background-color: #fde19a;
    background-image: -moz-linear-gradient(top, #fdd49a, #fdf59a);
    background-image: -ms-linear-gradient(top, #fdd49a, #fdf59a);
    background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#fdd49a), to(#fdf59a));
    background-image: -webkit-linear-gradient(top, #16b908, #387e31);
    background-image: -o-linear-gradient(top, #fdd49a, #fdf59a);
    background-image: linear-gradient(top, #fdd49a, #fdf59a);
    background-repeat: repeat-x;
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fdd49a', endColorstr='#fdf59a', GradientType=0);
    border-color: #fdf59a #fdf59a #fbed50;
    border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
    filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);
    color: #fff;
}

.dataTables_wrapper .dataTables_filter input {
    border: 1px solid #aaa;
    border-radius: 60px;
    padding: 10px 15px;
    background-color: #f8f9fa;
    margin-left: 3px;
    border-color: #f8f9fa;
}

.dataTables_wrapper .dataTables_paginate {
    padding-top: 15px;
    padding-bottom: 15px;
}

.dataTables_wrapper .dataTables_info {
    padding-top: 20px;
}

.dataTables_wrapper .dataTables_filter [type=search] {
    outline-offset: -2px;
    -webkit-appearance: none;
    outline: 2px solid transparent;
}

/* TIMEPICKER */

    #timepicker {
  width: 20%;
  margin: 30px 40%;
  margin-bottom: 0;
  position: absolute;
}

.timepicker_wrap {
    top: 70px;
    left: 5px;
    display: none;
    position: absolute;
    background: rgb(255 255 255);
    border-radius: 5px;
    width: 97%;
    border: 1px solid #d2d2d2;
    padding: 10px 10px;
    z-index: 9999;
}

.hour, .min, .meridian, .sec {
  float: left;
  width: 60px;
  margin: 0 10px;
}

.timepicker_wrap .btn {
    background: url(images/arrow.png) no-repeat;
    cursor: pointer;
    padding: 18px;
    border: 2px solid hsl(115deg 44% 50%);
    width: 30%;
    margin: auto;
    border-radius: 5px;
}

.timepicker_wrap .prev {
    background-position: 49% -60%;
}

.timepicker_wrap .next { background-position: 50% 150%; }

.timepicker_wrap .ti_tx {
    margin: 10px 0;
    width: 102%;
    text-align: justify;
}

.timepicker_wrap .in_txt {
  border-radius: 10px;
  width: 70%;
  float: none;
  text-align: center;
  padding-bottom: 8px;
  border: 2px solid hsl(0, 0%, 0%);
  font-family: georgia, helvetica, arial;
  font-weight: 700;
  font-size: 1.5em;
}

.timepicker_wrap > .hour > .ti_tx:after {
  content: '';
  font-size: 1em;
  padding-left: 0.2em;
  font-weight: 700;
}

.timepicker_wrap >.min > .ti_tx:after {
  content: '';
  font-size: 1em;
  padding-left: 0.2em;
  font-weight: 700;
}

.timepicker_wrap > .sec > .ti_tx:after {
  content: '';
  font-size: 1em;
  padding-left: 0.2em;
  font-weight: 700;
}

.timepicker_wrap > .meridian > .ti_tx:after {
  content: '';
  font-size: 1em;
  padding-left: 0.2em;
  font-weight: 700;
}

.add-btn .btn.btn-primary {
    background-color: #fff;
    border-color: #50b847;
    color: #50b847;
    border-radius: 6px;
}

.add-btn .btn.btn-primary:hover {
    transition: all .5s ease-in;
    background-color: #50b847;
    color: #fff;
}

/* RESPONSIVE MEDIA QUERIES */
@media only screen and (max-width: 1366px) and (min-width: 1200px) {
    .buttons .btn.btn-danger, .buttons .btn.btn-secondary, .buttons .btn-primary {
        padding: 5px 25px;
        margin-right: 3px;
    }
}

@media only screen and (max-width: 1199px) and (min-width: 1120px)  {
    .buttons {
        display: flex;
        align-items: baseline;
        flex-flow: wrap;
    }
    .buttons .btn.btn-danger {
        margin-top: 10px;
    }
}

@media only screen and (max-width: 1119px) and (min-width: 992px)  {
    .buttons .btn.btn-danger {
        margin-top: 10px;
    }
}

@media (max-width: 991px) {
	.image {
    	background-size: cover;
	}
	.login-image {
    	min-height: 515px;
    	position: relative;
    	overflow: hidden;
	}
	section.login {
	    background: linear-gradient( 
	0deg
	 , #edf8ec 50%, rgb(255 255 255) 50%);
	}
	.footer p {
		text-align: center;
	}
}

@media (max-width: 768px) {
	.login-image {
    	min-height: 400px;
	}
	.main-content {
    	padding: 35px 90px 35px 90px;
	}
}

@media (max-width: 576px) {
	.login-image {
    	min-height: 300px;
	}
	.page__content {
    	display: inline-grid;
	}
}

@media (max-width: 414px) {
	.main-content {
    	padding: 35px 60px 35px 60px;
	}
	.login-image {
    	min-height: 215px;
	}
}


.role-type a.links.dropbtn {
    color: #222260;
    font-size: 15px;
    padding: 0 20px;
    display: block;
    line-height: 50px;
    margin-bottom: 5px;
    text-decoration: none;
}

.role-type a.links.dropbtn:hover {
    color: #50b847;
    background-color: #dcf1da;
    border-radius: 50px;
}

.role-type a.links.dropbtn i {
    color: #50b847;
}

.role-type .dropdown {
    position: relative;
    display: inline-block;
    width: 100%;
}

.role-type .dropdown-content {
  display: none;
  position: absolute;
  background-color: #fff;
  min-width: 160px;
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
  z-index: 1;
  border-radius: 10px;
}

.role-type .dropdown-content a {
  color: black;
  padding: 12px 16px;
  text-decoration: none;
  display: block;
}

.role-type .dropdown-content a:hover {
    background-color: rgb(80 184 71 / 20%);
    border-radius: 10px;
}

.role-type .dropdown:hover .dropdown-content {display: block;}

.role-type .dropdown:hover .dropbtn {
    background-color: #3e8e41;
}

.input-field {
    padding: 7px 15px;
    margin-top: 10px;
    border-radius: 5px;
    background-color: #e4e4e4;
}

/* 22-09 */

.page__content .card-body {
    padding: 20px 20px 60px 20px;
}

/*PDF Code*/
.table_content_policy .table-responsive {
    padding: 0;
}

.table_content_policy th {
    background-color: #4ab447;
    color: #fff;
    text-align: center;
}

.table_content_policy .border {
    border: 1px solid #000000 !important;
    overflow: hidden;
}

.input-group-text {
    padding: 0;
    background-color: rgb(233 236 239 / 0%);
    border: 1px solid rgb(206 212 218 / 0%);
    border-radius: 0;
}

.work_table_4, .dates_table_5, .permit_table_6, .finalcheckup_table_8, .finalcheckup_table_9 {
    width: 100%;
}

.border-bottom {
    border-bottom: 1px solid #000000 !important;
}

.finalcheckup_table_8 th {
    background-color: transparent;
    color: #000;
}

.table_content_policy td {
    padding: 0px 10px;
}

.table_content_2 .table-bordered td, .table_content_2 .table-bordered th {
    border: 1px solid #000000;
}

.table_content_2 .table-bordered thead td, .table_content_2 .table-bordered thead th {
    border-bottom-width: 1px;
}

.checklist_photo h4 {
    background-color: #4ab447;
    color: #fff;
    padding: 8px 0px;
    font-size: 18px;
}

.table_content_2 h3 {
    font-size: 20px;
}

.table_content_2 {
    padding: 40px 0px;
}

table.inner_table {
    margin-left: 10px;
    width: 96%;
}

.inherited_text.border {
    width: 33%;
}

@media print {
	.table_content_2 {
		background-color: red;
		 -webkit-print-color-adjust: exact; 
		 font-size: 18px;
	}
}

.inp_table .table-bordered thead th {
    background-color: #ffc000;
}

.inp_table .table-bordered td {
    background-color: #92d050;
}

.inp_table .table-bordered td, .inp_table .table-bordered th {
    border: 1px solid #000000;
}

.page__content .ip {
    padding: 7px 10px;
    margin-bottom: 15px;
    color: #fff;
}