body
{
	color:#1f1919 !important;
	font-family: 'Roboto', sans-serif;
}
.main-bg {
    background: whitesmoke;
    padding-top: 40px;
}
h1 {
    font-size: 22px;
    font-weight: 600;
    margin-bottom: 25px;
}
.home-right-icon i {
    font-size: 19px;
}
.login-grid {
    display: grid;
    grid-template-columns: 50% 50%;
    height: 100vh;
    overflow: hidden;
}

.login-left-section {
    background: #e8eef1; 
    align-items: center;
    display: flex; 
    justify-content: space-between;
    flex-direction: column;
    text-align: center;
	padding: 30px 0px;
}

.login-left-content figure {
    width: 65%;
    margin: 0 auto;
}

.login-left-content figure img {
    width: 100%;
	margin-bottom: 30px;
}

.login-left-content h2 {
    font-family: 'Roboto', sans-serif;
    font-weight: 600;
    font-size: 20px;
    width: 62%;
    margin: 0 auto;
    margin-bottom: 15px;
}

.login-left-content p {
     width: 60%;
    margin: 0 auto;
}
.powered-by {
    display: flex;
    align-items: center;
    gap: 10px;
	    justify-content: center;
		    margin-top: 20px;
}
.powered-by p {
    margin-bottom: 0;
    font-size: 12px;
    opacity: .4;
	font-weight: 500;
}
.login-right-section {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    padding: 30px 150px;
}

.form-group label {
    font-size: 14px;
    font-weight: 500;
    display: block;
    margin-bottom: 5px;
}

.form-group input {
    background: #fafafa;
    border: 1px solid #cad3d9;
    width: 100%;
    height: 52px;
    border-radius: 6px;
	    padding-left: 10px;
}

.form-group a {
    color: #13658f;
    font-size: 14px;
    font-weight: 500;
    text-decoration: none;
    margin-top: -7px;
    display: block;
    margin-bottom: 5px;
}

.form-group {
    margin-bottom: 20px;
}

.forgot-password {
    color: #f65250;
    font-size: 14px;
    font-weight: 500;
    text-decoration: none;
    margin-top: -12px;
    display: block;
        margin-bottom: 25px;
}
.forgot-password:hover {
    color: #13658f;
    text-decoration: none;
}
.form-button {
    display: flex;
    flex-direction: column;
    gap: 15px;
}

.orange-button {
    background: #f65250;
    height: 52px;
    border-radius: 6px;
    border: 1px solid #f65250;
    color: #fff;
    font-weight: 500;
	 transition: .5s all ease;
}
.orange-button:hover {
    background: none;
    border: 1px solid #f65250;
    color: #f65250;
    transition: .5s all ease;
}
.gray-button {
    background: #cdd3d6;
    height: 52px;
    border-radius: 6px;
    border: 1px solid #cdd3d6;
    color: #535253;
    font-weight: 500;
	 transition: .5s all ease;
}
.gray-button:hover {
    background: none;
    border: 1px solid #cdd3d6;
    color: #1f1919;
    transition: .5s all ease;
}
.login-logo {
    display: flex;
    justify-content: center;
    margin-bottom: 30px;
}
.login-logo img {
    width: 100px;
}
.login-copyright p {
    margin-bottom: 0;
    font-size: 12px;
    opacity: .4;
    text-align: center;
	font-weight: 500;
}
.login-copyright p span {
    display: block;
}

.powered-by img {width: 42px;}

 







.checkbox {
    display: flex;
	gap: 15px;
	    font-weight: 500;
		 font-size: 14px;
}
.checkbox input {
    width: 24px;
    height: 26px;
    border: 1px solid #cad3d9;
    background: #fafafa;
    border-radius: 6px;
}
.form-group input:focus {
    outline: none;
       padding-left: 10px;
}
.checkbox {
  position: relative;
}

.checkbox label {
	border: 1px solid #ccc;
    border-radius: 8px;
    cursor: pointer;
    height: 25px;
    left: 0;
    position: absolute;
    top: -2px;
    width: 25px;
}

.checkbox label:after {
  border: 2px solid #fff;
  border-top: none;
  border-right: none;
  content: "";
  height: 6px;
  left: 7px;
  opacity: 0;
  position: absolute;
  top: 8px;
  transform: rotate(-45deg);
  width: 12px;
}

.checkbox input[type="checkbox"] {
  visibility: hidden;
}

.checkbox input[type="checkbox"]:checked + label {
    background-color: #f65250;
    border-color: #f65250;
}

.checkbox input[type="checkbox"]:checked + label:after {
  opacity: 1;
}

/**************** attendance sheet page css ***************/
.attenedence-inside-grid {
    display: grid;
    grid-template-columns: 12% 86%;
    align-items: center;
    margin-bottom: 35px;
    gap: 2%;
}

.attenedence-inside-grid form {
    width: 100%;
}

.attenedence-inside-grid form {
    display: flex;
    gap: 30px;
    align-items: baseline;
}

.orange-btn {
    background: #f65250;
    border: 1px solid #f65250 ;
    border-radius: 6px;
    color: #fff !important;
    padding: 6px 26px;
    font-weight: 500;
	transition: .5s all ease;
	text-decoration:none !important
}
.orange-btn:hover {
    background: none;
    border: 1px solid #f65250;
    transition: .5s all ease;
    color: #f65250 !important;
}
.attenedence-inside-grid .month-section {
    width: 18%;
}

.attenedence-inside-grid .month-section select {
    padding-bottom: 6px;
}

.date-data span {
    display: block;
    text-align: center;
}

.date-section-grid {
    display: grid;
    grid-template-columns: repeat(11, 1fr);
}

.date-data {
    text-align: center;
    color: #000000;
    font-size: 14px;
	    font-weight: 500;
}

.date-data span {
    width: 42px;
    height: 42px;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 0 auto;
    color: #fff;
    margin-bottom: 6px;
    font-size: 17px;
    font-weight: 500;
}

.date-section {
       margin-bottom: 35px;
}

.common-table-class thead {
    background: #ececec;
}
.common-table-class thead th {
    font-weight: 800;
    color: #000;
    padding: 20px;
    padding: 25px 15px;
    font-size: 16px;
}

.table-check label {
    border-radius: 2px;
    width: 20px;
    height: 20px;
    top: 4px;
    left: 12px;
}
.checkbox.table-check   label:after {
    
    left: 3px; 
    top: 5px; 
}

.status-table {
    width: 14px;
    height: 14px;
    border-radius: 50%;
    display: block;
}

.date-day-table h4 span {
    display: block;
    color: #9a9a9a;
    font-weight: 400;
}

.date-day-table h4 {
    font-size: 14px;
    color: #000;
    font-weight: 400;
    text-align: left;
	    margin-bottom: 0;
}

.inTime {
    background: #fafafa;
    border: 1px solid #cad3d9;
    border-radius: 8px;
        padding: 5px 25px;
    text-align: center;
    font-size: 15px;
    color: #9a9a9a;
}

 

.common-table-class td {
    border: none;
    text-align: left;
    color: #000;
    padding: 15px;
    padding-bottom: 25px;
    padding-top: 25px;
    vertical-align: middle;
}

.intimetd {
    width: 110px;
}

.regularize select {
    background: #fafafa;
    border: 1px solid #cad3d9;
    border-radius: 8px;
    padding: 5px 5px;
    text-align: left;
    font-size: 15px;
    color: #9a9a9a;
    width: 80%;
}

.table-check {
    margin-bottom: 0;
}

td.status-width {
    width: 30px;
     
}
td.status-width {
    vertical-align: inherit;
}

td.status-width div {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100%;
}
.table-responsive { 
    border-radius: 10px;
}
 
.remarks-flex i {
    font-size: 18px;
    color: #999999;
	    cursor: pointer;
}

.remarks-flex {
    display: flex;
    align-items: center;
    gap: 20px;
}
.common-table-class tr {
    border-bottom: 1px solid #e3e3e3;
    border-left: 1px solid #e3e3e3;
    border-right: 1px solid #e3e3e3;
	    
}
 
.time-unset {
    background: none;
    border: none;
    text-align: left;
    padding: 0;
	    color: #9a9a9a;
}
.common-table-class {
    background: #fff;
    border-left: 1px solid #e3e3e3;
    border-right: 1px solid #e3e3e3;
    border-bottom: 1px solid #e3e3e3;
	    border-radius: 10px;
}
.final-remark-container {
    padding: 15px 30px;
}

.final-remark-grid {
    display: grid;
    grid-template-columns: 14% 81%;
    align-items: center;
    gap: 2%;
}

.final-remark-grid textarea {
    width: 100%;
    background: #fafafa;
    border: 1px solid #cad3d9;
    border-radius: 8px;
    height: 80px;
}

.final-remark-grid form {
    display: grid;
    align-items: center;
    width: 100%;
    grid-template-columns: 75% 22%;
    gap: 2%;
    justify-content: space-between;
}
textarea:focus {
    outline: none;
    padding-left: 15px;
}
.regutextarea textarea {
    border: none;
    overflow: hidden;
    font-size: 14px;
    background: #fafafa;
    border: 1px solid #cad3d9;
    border-radius: 8px;
    padding: 5px 10px;
    text-align: center;
    color: #9a9a9a;
    height: unset;
    text-align: left;
    width: 85%;
}

.modal-content .modal-body .form-input .modal-form-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 20px;
}

.modal-content .modal-body .form-input .form-group {
    margin-bottom: 0;
}
.comment-textarea {
    margin-top: 20px;
    margin-bottom: 20px !important;
}
textarea {
    background: #fafafa;
    border: 1px solid #cad3d9;
    width: 100%;
    height: 52px;
    border-radius: 6px;
    height: 100px;
	    padding-left: 10px;
		    padding: 8px;
    border-radius: 6px;
    border: 1px solid #cad3d9;
    background: #fafafa;
    width: 100%;
}













/**************** attendance sheet page css ***************/



/**************** Profile css page Start ***************/
.profile-information-content img {
    width: 25px;
}

.profile-information {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
}

.profile-information-content h3 {
    font-size: 16px;
    color: #000;
    font-weight: 600;
    margin-bottom: 0;
}

.profile-information-content h3 span {
    display: block;
    color: #9a9a9a;
    font-weight: 500;
    font-size: 14px;
}

.profile-information-content {
    display: flex;
    align-items: flex-start;
    gap: 8px;
}

.profile-user-name h2 span {
    display: block;
    font-size: 15px;
    color: #9a9a9a;
    font-weight: 500;
    margin-top: 5px;
}

.profile-top-left {
    display: grid;
    grid-template-columns: 10% 88%;
    gap: 2%;
}

.profile-user-name {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    margin-bottom: 25px;
}
.profile-top-details {
    padding-top: 25px;
    padding-bottom: 25px;
}
.tab-content {
    background: #fff;
    border: 1px solid #dddfeb;
    border-color: #dddfeb00 #dddfeb #dddfeb;
    padding-top: 30px;
}

ul.nav.nav-tabs.box-shape {
    margin-bottom: 0;
    border-bottom: none;
    border-radius: 0;
    padding: 0;
}

.profile-tab li a {
    font-size: 18px;
    color: #063f84 !important;
    font-weight: 600;
    margin-bottom: 0;
	    padding: 15px 50px;
}

.profile-tab li a.active {
    color: #000 !important;
}
.tab {
    
   
}

/* Style the buttons and li inside the tab */
.tab button {
  display: block;
  background-color: inherit;
  color: black;
      padding: 6px 16px;
  width: 100%;
  border: none;
  outline: none;
  text-align: left;
  cursor: pointer;
  transition: 0.3s;
  font-size: 17px;
}
.tab li {
  display: block;
  background-color: inherit;
  color: black;
      padding: 6px 16px;
  width: 100%;
  border: none;
  outline: none;
  text-align: left;
  cursor: pointer;
  transition: 0.3s;
  font-size: 17px;
}
/* Change background color of buttons on hover */
 

/* Create an active/current "tab button" class */
.tab button.active {
    color: #f65250;
    border-bottom: 1px solid #000;
}

.tab li.active {
    color: #f65250;
    border-bottom: 1px solid #000;
}

/* Style the tab content */
.tabcontent {
  }
.tabtotab-grid {
    display: grid;
    grid-template-columns: 16% 70%;
    gap: 5%;
    padding: 15px 50px;
}

.tabtotab-grid .tab i {
    display: none;
    font-size: 18px;
}

.tabtotab-grid .tab .active i {
    display: block;
    color: #000;
}

.tabtotab-grid .tab button {
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-size: 14px;
    padding: 0;
    padding-bottom: 5px;
    margin-bottom: 15px;
	    color: #003a82;
}
.tabtotab-grid .tab li {
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-size: 14px;
    padding: 0;
    padding-bottom: 5px;
    margin-bottom: 15px;
	    color: #003a82;
}

.tabtotab-grid .tab button.active {
    color: #f65250;
}

.tabtotab-grid .tab li.active {
    color: #f65250;
}

.profile-grid-content {
    display: grid;
    grid-template-columns: 100%;
    gap: 3%;
}

.profile-right-container {
    display: grid;
    grid-template-columns: 48% 48%;
    gap: 2%;
}

.profile-grid-content ul li {
    list-style: none;
    margin-bottom: 15px;
    font-weight: 500;
    font-size: 14px;
    display: grid;
    align-items: center;
    gap: 30px;
    width: 100%;
       grid-template-columns: 35% 50%;
}

.profile-grid-content ul {
    padding-left: 0;
}

.profile-grid-content ul:nth-child(2) li {
    color: #9a9a9a;
}

.tabtotab-grid .tab button:hover {
    color: #f65250;
}
.profile-image img {
    width: 103px;
    height: 103px;
    border-radius: 50%;
}
.desktop-show
{
display:block;
}	
.mobile-show
{
display:none;
}		
	
.nav-tabs .nav-link:focus, .nav-tabs .nav-link:hover {
    border-color: #eaecf400 #eaecf400 #dddfeb;
}
.profile-grid-content li input {
    list-style: none;
    font-weight: 500;
    font-size: 14px;
    border: none;
    color: #9a9a9a;
    padding: 8px;
    border-radius: 6px;
    border: 1px solid #cad3d9;
    background: #fafafa;
}
.profile-grid-content li select {
    list-style: none;
    font-weight: 500;
    font-size: 14px;
    color: #9a9a9a;
    height: unset;
    padding: 8px;
    border-radius: 6px;
    border: 1px solid #cad3d9;
    background: #fafafa;
    width: 100%;
}
.profile-grid-content li input:focus {
    border-bottom: 1px solid #ccc;
        padding-left: 2px;
    padding: 0;
	 padding-left: 2px;
}
.profile-grid-content li input:focus {
    padding: 8px;
}
 .my-p-update-btn {
    display: flex;
    justify-content: center;
    padding-bottom: 50px;
}
.tabtotab-grid { 
    grid-template-columns: 16% 79%; 
}
.tabtotab-grid.new-tab-grid td {font-size: 14px;}

.tabtotab-grid.new-tab-grid th {font-size: 14px;}


/**************** Profile css page End ***************/








/**************** Leave sheet page start ***************/
.leave-grid {
    display: grid;
    grid-template-columns: 22% 13%;
    align-items: center;
    margin-bottom: 35px;
    gap: 2%;
    justify-content: space-between;
    padding: 25px 15px;
    margin-bottom: 0;
    border-radius: 10px 10px 0px 0px;
}
.leave-page {
    border-radius: 0px 0px 10px 10px;
}

.leave-page .table-responsive {
    border-radius: 0px 0px 10px 10px;
}
.bluetd {
    color: #003a82;
}
.leave-page {
    border-radius: 0px 0px 10px 10px;
    border-bottom: none;
}

.leave-page table{
    margin-bottom: 0;
}
.h1-flex {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 25px;
}

.h1-right {
    display: flex;
    align-items: center;
    gap: 35px;
}

.h1-flex h1 {
    margin-bottom: 0;
}

.h1-right a {
    color: #003a82;
    text-decoration: underline;
} 

/**************** Leave sheet page end ***************/







/****** upload employee document start ****/
.w-30 {
    /* width: 30%; */
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
}

select {
    background: #fafafa;
    border: 1px solid #cad3d9;
    width: 100%;
    height: 52px;
    border-radius: 6px;
    padding-left: 10px;
    padding-right: 10px;
}

.pt-20 {
    padding-top: 30px;
}

.upload-employ .form-group {
    margin-bottom: 30px;
}

.upload-employ input {
    color: #565656;
}

.upload-employ select {
    color: #565656;
}
.w-40 {
    width: 40%;
    margin: 0 auto;
}
.upload-employ .form-group p {
    margin-top: 5px;
    font-style: italic;
    color: #8d8d8d;
    font-size: 12px;
}

.upload-employ .form-button {
    display: grid;
    justify-content: space-between;
    grid-template-columns: 70% 20%;
    align-items: center;
    width: 100%;
}

.upload-employ .form-button a {
    text-align: right;
    text-decoration: underline;
	color:#003a82;
	
}
h1 span {
    display: block;
    font-size: 14px;
    color: #545454;
    font-weight: 500;
    margin-top: 8px;
}

.upload-employ {
    padding-bottom: 80px;
}
 

.dark-gray-btn {
    background: #707070;
    border: 1px solid #707070;
    border-radius: 6px;
    color: #fff !important;
    padding: 6px 16px;
    font-weight: 500;
    transition: .5s all ease;
    text-decoration: none !important;
}

.upload-employ .form-button button {
    width: 150px;
}
.dark-gray-btn:hover {
    background: none;
    border: 1px solid #707070;
    color: #707070 !important;
}
.input-file {
    padding-top: 10px;
}
.upload-employ .form-button div {
    display: flex;
    gap: 15px;
}





/****** upload employee document end****/








/****** RTL CSS START****/
.rtl .navbar-nav.sidebar {
    padding-right: 0;
}

.rtl a.sidebar-logo {
    display: flex;
}

.rtl h2 {
    text-align: right;
}

.rtl .action-list ul {
    padding-right: 0;
}

.rtl .top-search input {
    display: flex;
    padding-left: 35px;
    padding-right: 30px;
}

.rtl .top-search i {
    left: unset;
    right: 9px;
}

.rtl .topbar {
    padding-right: 0;
} 

/****** RTL CSS END****/



/******* Tickets page Css Start *******/
.ticket-form-grid {
    display: block;
}
.ticket-form-grid form > div {
    width: 70%;
    display: flex;
    gap: 30px;
}
.ticket-form-grid form {
    display: flex;
    gap: 30px;
    align-items: baseline;
    justify-content: space-between;
}
.ticket-form-grid {
    width: 100%;
}

.ticket-form-grid {
    width: 100%;
}
.ticket-form-grid 
 .month-selection {
    width: 100%;
}.attendence-section.box-shape.attenedence-inside-grid.ticket-form-grid {}

.ticket-form-grid .month-section {
    width: 40%;
}
 

.ticket-form-grid .month-section select {
    color: #898989;
    border-bottom: 1.5px solid #898989;
}
.attendence-section.box-shape.attenedence-inside-grid.ticket-form-grid {
    border: none;
    padding: 25px 50px;
	    padding-top: 0;
}
.ticket-table .common-table-class {
    border-radius: 0px;
}

.ticket-table .table-responsive {
    border-radius: 0;
}

.table-responsive {}

.ticket-content .attendence-section.box-shape.attenedence-inside-grid.ticket-form-grid {
    padding-bottom: 0;
}

.ticket-content {}

.w-150 > div {width: 150px;}

td.status-width.w-120 {}

.ticket-table .remarks-flex {}

.view-color {
    color: #225493;
    font-weight: 500;
}
.ticket-form-grid button {
    padding: 6px 36px;
}

.ticket-form-grid input {
    color: #898989;
    border: none;
    border-bottom: 1.5px solid #898989;
}.attendence-section.box-shape.attenedence-inside-grid.ticket-form-grid {}

.assigned-me > div {
    width: 100% !important;
}

.w-150 {
    width: 120px;
}

.assigned-me .month-section {
    width: unset;
}

form.assigned-me select {
    padding-right: 60px;
}

.assigned-me input:focus {
    padding-left: 2px;
}

.w-250 {
    width: 250px !important;
}

input.w-200 {}

.stage-ticket {
    width: 100px;
}
.verticle-center {
    justify-content: center;
    align-items: center;
    display: flex;
}
.ticket-table .table-responsive {
    padding-bottom: 50px;
} 


/******* Tickets page Css Start *******/




/******** Approve Resignation css start *******/
.approve-resignation label {
    border: none;
}



/******** Approve Resignation css start *******/




/******** Individul Ticket css start *******/
.profile-top-grid {}.individual-ticketss .profile-top-left {
    display: unset;
}

.individual-ticket-details h3 {
    font-size: 14px;
}

.individual-ticket-details {}

.individual-ticket-details h3 span {
    display: block;
    font-weight: 400;
}

.individual-ticket-details {}

.individual-ticket-grid {
    display: grid;
    grid-template-columns: 27% 12% 12% 16% 14% 16%;
    gap: .6%;
}

.form-button.pt-20.indi-tick-button {
    display: flex;
    flex-direction: revert;
    justify-content: space-between;
}
.bg-none {
    background: none;
}

.border-none {
    border: none;
}
.bg-gray
{
    background: whitesmoke;
	
}

a {
    color: #003a82;
    cursor: pointer;
}

/******** Individul Ticket css end *******/


/******* login attendance popup *****/
.modal-title {
    font-size: 18px;
    font-weight: 600;
    margin-bottom: 0;
}

.modal-title span {display: block;
    font-weight: 400;font-size: 14px;}

.camera-area {
    width: 100%;
    height: 280px;
    background: #eeeeee;
    border-radius: 10px;
    margin-bottom: 20px;
}

.capture-button input {opacity: 0;z-index: 99999;position: relative;}

.capture-button span {display: block;width: 60px;height: 60px;background: #e1e1e1c4;border: 4px solid #ffffffad;border-radius: 50%;padding: 5px;position: absolute;bottom: -28px;}

.capture-button {position: absolute;bottom: 30px;transform: translate(-50%, -50%);left: 50%;}

.preiview-image img {
    width: 150px;
    height: 150px;
    object-fit: cover;
    margin-top: 10px;
    border-radius: 10px;
    position: relative;
    left: 20px;
	    margin-bottom: 20px;
}
.camera-area-container {
    position: relative;
}
.preiview-image {
    display: flex;
    justify-content: space-between;
    /* align-items: end; */
    position: relative;
    top: -80px;
    flex-direction: column;
    margin-bottom: -80px;
}
 

.camera {display: grid;grid-template-columns: repeat(2, 1fr);gap: 15px;}

.camera-area-container h2 {margin-bottom: 10px;}

.disabled-btn {
    background: #dedede;
    border: 1px solid #dedede;
    color: #a6a6a6;
}
.disabled-btn:hover {
    background: none;
    border: 1px solid #dedede;
    color: #a6a6a6;
}

.form-button p {
    font-size: 14px;
    margin-top: -10px;
}
















/******* login attendance popup end *****/




/***** e joinning page css start *******/
.e-join-prsn-det .profile-grid-content textarea {list-style: none;
    font-weight: 500;
    font-size: 14px;
    
    color: #9a9a9a;height: 60px; }

.three-input-feild {display: grid;grid-template-columns: repeat(3, 1fr);    gap: 20px;}

.e-join-prsn-det .main-bg {padding-bottom: 0;}

.e-join-prsn-det {
    background: whitesmoke;
}
.pb-30 {
    padding-bottom: 30px;
}
.sidebar .e-joining-side-nav .nav-item .nav-link span {
    font-size: 14px !important;
    color: #D6D6D6;
	    font-weight: 300;
}

.e-joining-side-nav-active a span {
    color: #fff !important;
    font-weight: 500 !important;
}
.profile-grid-content ul li span b {
    color: red;
}





/****** ejoin login css start *****/
.e-join-login-grid .login-left-content {
    text-align: left;
    padding: 0px 40px 0px 60px;
}

.e-join-login-grid .login-left-content h2 {width: 100%;}

.e-join-login-grid .login-left-content ul {padding-left: 15px;}

.e-join-login-grid .login-left-content ul li {
    list-style: auto;
    margin-bottom: 15px;
    font-size: 14px;
    width: 88%;
    text-align: justify;
}

.e-join-login-grid .login-left-content h3 {font-family: 'Roboto', sans-serif;
    font-weight: 600;
    font-size: 20px;
    width: 62%;
    
    margin-bottom: 15px;color: #f65250;}
	
.e-join-login-grid .login-left-content figure img {width: 85%;}

.e-join-login-grid .login-left-section {padding-top: 0;}

 .e-join-login-grid .form-button {
    margin-top: 40px;
}
.e-join-login-grid .login-left-content ul li span {
    color: #f65250;
}	
	
/****** ejoin login css end *****/



/***** ejoin qualification css start ****/
.edit-details {
  height: 100%;
  width: 0;
  position: fixed;
  z-index: 1;
  top: 0;
  right: 0;
    background-color: #fff;
  overflow-x: hidden;
  transition: 0.5s;
  padding-top: 50px;
}

.edit-details a {
    padding: 0px 0px 8px 21px;
    text-decoration: none;
    font-size: 25px;
    color: #818181;
    display: block;
    transition: 0.3s;
}

.edit-details  a:hover {
  color: #f1f1f1;
}

.edit-details  .closebtn {
  position: absolute;
  top: 0;
  right: 25px;
  font-size: 26px;
  margin-left: 50px;
}

#main {
  transition: margin-left .5s;
  padding: 16px;
}
.ejoin-side-editPanel .profile-grid-content {display: block;}

.ejoin-side-editPanel .profile-grid-content li {display: block;margin-bottom: 20px;}

.ejoin-side-editPanel .profile-grid-content input {width: 100%;}

.box-shape.ejoin-side-editPanel {border: none;}

.box-shape.ejoin-side-editPanel h2 {margin-bottom: 30px;}
.bgnoneEditDetailPanelOpen:after {content: "";display: block;background: #000000c2;width: 100%;height: 100%;position: absolute;top: 0;}



@media screen and (max-height: 450px) {
  .edit-details  {padding-top: 0px;}
  .edit-details  a {font-size: 18px;}
}
/***** ejoin qualification css end ****/


/***** E join language css start ****/
.three-input-feild .form-group {display: flex;align-items: center;gap: 4px;margin-bottom: 0;}

.three-input-feild .form-group input {width: 20px;height: 35px;}

td.lang-flex {display: flex;gap: 30px;}

.lang-unselect {opacity: .3;}


.profile-right-container ul {
    margin-bottom: 0;
}
.three-input-feild.three-input-feild-edit {display: block;}
 

/***** E join language css end****/




/***** final submit css start *****/
.final-submission h2 {color: #f65250;margin-bottom: 20px;}

.final-submission input {height: 30px;width: 23px;position: relative;top: -2px;}

.final-submission {}

.final-submission form .final-check {display: flex;gap: 10px;margin-bottom: 30px;}

.final-check {}

.final-submission .profile-grid-content li {grid-template-columns: 15% 20%;gap: 0;}

.final-submission .profile-grid-content li input {width: 100%;height: unset;}
/***** final submit css end *****/



/****  ejoin document css start ****/

.ejoin-document-left h3 {font-size: 12px;margin-bottom: 3px;}

.ejoin-document-left ul li {font-size: 14px;}

.ejoin-document-left ul {padding-left: 13px;}

.ejoin-document-left h3 strong {font-size: 16px;}

.edoc h1 {margin-bottom: 0;}

.ejoin-document-container {display: grid;grid-template-columns: 50% 50%;gap: 20px;}

.edoc p {font-size: 14px;}

.edoc .profile-right-container {display: block;margin-bottom: 20px;}

.edoc  .form-button {padding-bottom: 10px;}

.ejoinModalDoc img {
    width: 100%;
}











/****  ejoin document css start ****/














/***** e joinning page css end *******/





/*** Home Page Css Gallery Part start *****/
.photo-gallery-section-dashboard {height: 400px;overflow: hidden;overflow-Y: scroll;}

.photo-gallery-section-dashboard::-webkit-scrollbar {
  width: 10px;
}

/* Track */
.photo-gallery-section-dashboard::-webkit-scrollbar-track {
  background:#fac8c7; 
    border-radius:20px;
}
 
/* Handle */
.photo-gallery-section-dashboard::-webkit-scrollbar-thumb {
  background: #f65250; 
      border-radius: 20px  20px 20px 20px ;
}

/* Handle on hover */
.photo-gallery-section-dashboard::-webkit-scrollbar-thumb:hover {
  background: #ba4846; 
      border-radius:20px;
}

.home-gallery-container {margin-bottom: 35px;}
#wrapper #content-wrapper #content {
    flex: 1 0 auto;
    background: whitesmoke;
}

.big-gallery-images img {
       height: 277px !important;
    width: 100%;
    
}
.photo-gallery-section-dashboard img {
     height: 86px;
    object-fit: cover;
}


/*** Home Page Css Gallery Part end *****/




/***** Leadership popup css start *****/
.leadership-modal .box-shape {background: no-repeat;border: none;padding: 0;}

.popup-h-500 {height: 470px;overflow-y: scroll;}


.leadership-modal .box-shape::-webkit-scrollbar {
  width: 10px;
}

/* Track */
.leadership-modal .box-shape::-webkit-scrollbar-track {
  background:#fac8c7; 
    border-radius:20px;
}
 
/* Handle */
.leadership-modal .box-shape::-webkit-scrollbar-thumb {
  background: #f65250; 
      border-radius: 20px  20px 20px 20px ;
}

/* Handle on hover */
.leadership-modal .box-shape::-webkit-scrollbar-thumb:hover {
  background: #ba4846; 
      border-radius:20px;
}






.mySlides {display: none}
 

/* Slideshow container */
.slideshow-container {
  max-width: 1000px;
  position: relative;
  margin: auto;
}

/* Next & previous buttons */
.slideshow-container .prev, .slideshow-container .next {
  cursor: pointer;
  position: absolute;
  top: 50%;
  width: auto;
  padding: 16px;
  margin-top: -22px;
  color: white;
  font-weight: bold;
  font-size: 18px;
  transition: 0.6s ease;
  border-radius: 0 3px 3px 0;
  user-select: none;
}

/* Position the "next button" to the right */
.slideshow-container .next {
  right: 0;
  border-radius: 3px 0 0 3px;
}

/* On hover, add a black background color with a little bit see-through */
.slideshow-container .prev:hover, .slideshow-container .next:hover {
  background-color: rgba(0,0,0,0.8);
}
 

/* The dots/bullets/indicators */
.dot {
  cursor: pointer;
  height: 15px;
  width: 15px;
  margin: 0 2px;
  background-color: #bbb;
  border-radius: 50%;
  display: inline-block;
  transition: background-color 0.6s ease;
}

 
/* Fading animation */
 
 

/* On smaller screens, decrease text size */
@media only screen and (max-width: 300px) {
  .prev, .next,.text {font-size: 11px}
}
.mySlides.fade {
    opacity: 1;
}
a.prev.prev2 {bottom: 0;height: fit-content;position: unset;color: #f65250;    padding: 0;}

a.next.next2 {color: #f65250;position: unset;}
 
 .button-leadership a:hover {
    background: none;
    opacity: .5;
}
 .slideshow-container .profile-with-name img {
    width: 100px;
    height: 100px;
    object-fit: cover;
}
 .leadership-modal .modal-header button {position: absolute;right: 20px;top: 11px;}

.leadership-modal .modal-header {flex-direction: column;padding: 0;margin-bottom: 15px;}

.leadership-modal .modal-header h5 {margin-bottom: 14px;}

.leadership-modal .modal-header .profile-with-name img {width: 60px;height: 60px;border-radius: 50%;}

.leadership-modal-heading h2 {color: #f65250;font-size: 18px;}

.leadership-modal-heading p {font-weight: 600;}

.leadership-modal .profile-with-name {margin-bottom: 15px;}

.leadership-modal .popup-h-500 {height: unset;overflow: unset;}

.leadership-modal .box-shape {height: 320px;
    overflow-y: scroll;}

.button-leadership {position: relative;top: -19px;left: 20px;}
 
/***** Leadership popup css end *****/



/***** New Joining Pop up css start ******/
.newJoin-popup-container .joining-section {display: flex;justify-content: space-between;align-items: center;border-bottom: 1px solid #e9e9e9;padding-bottom: 10px;margin-bottom: 10px;}

.joining-section > div {display: flex;align-items: center;gap: 10px;}

.newJoin-popup-container .joining-section h4 {font-weight: 600;
    
    font-size: 14px;margin-bottom: 0;}

.newJoin-popup-container .joining-section img {width: 47px;
    height: 47px;margin-bottom: 0;}

 

/***** New Joining Pop up css end ******/




/***** birthday Pop up css start ******/
.wish-B-A-popup .profile-tab li a {padding: 0;}

/*.wish-B-A-popup .nav.nav-tabs {border: none;}*/

.nav-tabs .nav-link:focus, .nav-tabs .nav-link:hover {}

.wish-B-A-popup .nav-tabs .nav-link.active {border: none;background: #f65250;color: #fff !important;font-size: 14px;}

.wish-B-A-popup .nav-tabs .nav-link {padding: 10px;font-size: 14px;color: #7e7e7e !important;}


.wish-B-A-popup .birthday-user-image img {width: 50px;height: 50px;border-radius: 50%;}

.wish-B-A-popup .birthday-user-details .birthday-user-name {font-size: 16px;}

.wish-B-A-popup .birthday-box {gap: 20px;margin-bottom: 15px;}

.wish-B-A-popup .tab-content.border-none {margin-top: 0;padding-top: 20px;}

.wish-B-A-popup textarea {margin-bottom: 8px;}

.wish-B-A-popup .tab-pane>div:nth-child(even) {margin-top: 30px;border-top: 1px solid #ccc;padding-top: 30px;}

.wish-B-A-popup .tab-pane button {font-size: 14px;}

.wish-B-A-popup .tab-pane textarea {font-size: 13px;}

textarea:focus {
    padding-left: 8px;
} 

/***** birthday Pop up css end ******/





/**** gallery popup css start ******/
.mim_tm_all_wrap.inside-full-bg.add-recipe.about-bg.gallery-page {
    background: #fff !important;
    padding-bottom: 0px;
}
main.main.gallery-container.galler-page-css p {
    width: 60%;
    margin-bottom: 50px;
}
main.main.gallery-container.galler-page-css .main .card-image {}

main.main.gallery-container.galler-page-css .card-image {
    width: unset;
}

main.main.gallery-container.galler-page-css  .ga.container {
    grid-template-columns: repeat(5, 1fr);
    grid-auto-flow: unset;
    grid-gap: unset;
    gap: 10px;
}

main.main.gallery-container.galler-page-css .card-image img {
    margin-bottom: 0;
    padding-bottom: 0;
}

main.main.gallery-container.galler-page-css {
    margin-bottom: 70px;
}
.gallery-popup a img {width: 100%;height: 140px;object-fit: cover;border-radius: 5px;}

.gallery-popup .thumbnail-gallery-image {grid-template-columns: repeat(4, 1fr);}

 


/**** gallery popup css end******/





/**** Notice board css start******/
.owl-carousel {
  width:100%;
      overflow: hidden;
}
.owl-nav {
    position: absolute;
    right: -20px;
    top: 4px;
    display: flex;
    flex-direction: column;
}



.owl-carousel .owl-nav {
  padding-top: 0.4em;
  font-size: 0.8em;
}
.owl-carousel .owl-nav > div {
    padding: 0.4em 1.4em;
    border: 1px solid #fff;
    background: #fff;
    color: white;
    border-radius: 0.4em;
    background-image: unset;
    box-shadow: unset;
}
.owl-carousel .owl-nav > div:hover {
  background-color: #333;
}
.owl-carousel .owl-nav .owl-prev {
  float: left;
}
.owl-carousel .owl-nav .owl-next {
  float: right;
}

.owl-nav1
{
	display:none;
}

.owl-prev i, .owl-next i
{
	color:#000;
	font-size:18px;
}

.owl-carousel .owl-nav > div:hover {
    background-color: #fff;
} 



/**** Notice board css end******/





/**** Search Popup css start ****/

.search-popup {display: flex;flex-direction: column;justify-content: center;align-items: center;gap: 25px;text-align: center;}

.search-popup img {width: 200px;height: 200px;object-fit: cover;border-radius: 50%;}

.search-popup ul li {list-style: none;text-align: center;margin-bottom: 2px;}

.search-popup ul {
    padding-left: 0;
    margin-left: 0;
    margin-bottom: 0;
}

.search-popup h2 {margin-bottom: 8px;}

.height-unset .modal-body{
    height: fit-content;
	overflow-y: unset;
}
.height-unset .modal-header {
    border: none;
    padding: 0;
    padding-right: 20px;
    padding-top: 10px;
}




/**** Search Popup css End ****/

.profile-right-container.cont-det h3 {font-size: 16px;}






/****** Leave Planner css start *******/
.desktop-w-130 {width: 130px;}

.desktop-w-70 {width: 70px;}

span.approved-leave {background: #7bc17b;display: block;width: 20px;height: 20px;border-radius: 50%;display: flex;justify-content: center;align-items: center;margin: 0 auto;}

span.Applied-leave {background: #66a2ec;
    display: block;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 0 auto;}

p.leavep {font-size: 14px;}

p.leavep span {font-weight: 800;}

.hint {display: flex;justify-content: space-between;}

.hint ul li {display: inline-flex;flex-direction: row;align-items: center;font-size: 14px;gap: 3px;}

.hint-bullets li {list-style: none;}

li.app-leave span {background: #7bc17b;
    display: block;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    
    
    
    }

li.appl-leave span {background: #66a2ec;
    display: block;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    
    
    
    }

.hint-bullets ul {display: flex;gap: 20px;}

 .leave-planer-table th span {display: block;}

.leave-planer-table th {text-align: left;}
/****** Leave Planner css End *******/


/***************** My Reportees css start******************/


.reportess-pics {width: 70px;height: 70px;border-radius: 50%;object-fit: cover;box-shadow: 0px 0px 4px 0px #ccc;}


















/***************** My Reportees css end******************/













/**** employee investement declaration css start ****/


p.grid-below-p span {display: block;font-size: 14px;font-weight: 400;}

p.grid-below-p {width: 100%;font-size: 14px;font-weight: 600;margin-top: 6px;}

.bor-dec {border-bottom: 1px solid #e2e2e2;padding-bottom: 5px;margin-bottom: 18px;}

.companyinformation {padding-top: 0;}

.companyinformation form .form-group {display: flex;align-items: center;gap: 6px;margin-bottom: 0;font-size: 16px;position: relative;top: -7px;}

.companyinformation form input {width: fit-content;width: 18px;}

.companyinformation p {
    font-size: 14px;
    font-weight: 400;margin-bottom: 0;width: 60%;}

.companyinformation .form-group {font-weight: 600;}

.companyinformation form p {margin-bottom: 14px;}

.bor-top-dec {border-top: 1px solid #e2e2e2;padding-top: 20px;}

.bor-top-dec input {width: 100% !important;}

.three-grid-dec {grid-template-columns: repeat(3, 1fr);}

.common-table-class thead th {font-size: 14px;}

.common-table-class td {font-size: 14px;}

.ticket-table.table-investement-dec .common-table-class {border: none;}

.ticket-table.table-investement-dec .table-responsive {padding-bottom: 0;}

.table-bottom {font-size: 16px;font-weight: 600;}
.employee-investement-page td {font-size: 13px;}

.employee-investement-page th {font-size: 13px !important;}
.emp-inves-modal {
    margin-top: 30px;
    display: block;
    font-size: 14px;
    text-decoration: underline;
}
.emp-inv-dec-modal  .modal-header h6 {font-size: 16px;}

.emp-inv-dec-modal .modal-body h2 {font-size: 16px;}

.emp-inv-dec-modal .profile-grid-content ul {display: grid;grid-template-columns: repeat(2, 1fr);width: 100%;}

.emp-inv-dec-modal .profile-grid-content ul li {gap: 10px;}

.emp-inv-dec-modal .profile-grid-content ul li {font-size: 12px;grid-template-columns: 37% 57%;}

 

.emp-inv-dec-modal .table-responsive {padding-bottom: 0px;}

.emp-inv-dec-modal .table-responsive table {margin-bottom: 0;}
.emp-ins-three-grid {
    display: grid;
    grid-template-columns: 50% 50%;
    margin-bottom: 0;
}

p.hereby {
    margin-top: 20px;
    width: 100%;
}

 

/**** employee investement declaration css end ****/








/***** My reportees Eyes css start **************/
.reportees-eye {display: grid;grid-template-columns: 20% 78%;align-items: center;gap: 2%;}

.repor-logo img {width: 100px;background: #fff;box-shadow: 0px 0px 4px 1px #ccc;height: 100px;border-radius: 50%;object-fit: cover;/* padding: 15px; */}

.repor-logo {
    background: #fff;
    
    
    border-radius: 50%;
    object-fit: cover;
    display: inline-flex;align-items: center;gap: 15px;width: 100%;}

.repor-logo h3 span {display: block;}

.repor-logo h3 {font-size: 18px;}

.reportees-user-det {display: grid;
    grid-template-columns: repeat(4, 1fr);
    align-items: center;
    gap: 15px;}

.cycle-container {
    padding-left: 80px;
    position: relative;
    padding-bottom: 30px;
}

.cycle-container:before {content: "";display: block;background: #d5d5d5;width: 4px;height: 100%;position: absolute;left: 56px;border-radius: 10px;}

.cycle-content:before {content: "";
    display: block;
    background: #f65250;
    width: 14px;
    height: 14px;
    position: absolute;
    left: -30px;
    border-radius: 10px;top: 0px;}

.cycle-content {position: relative;}

h2.wef {font-size: 12px;margin-bottom: 4px;}

h3.cycle-desig {font-size: 16px;color: red;margin-bottom: 3px;}

h4.from-to {font-size: 14px;}

.cycle-content-det {margin-bottom: 40px;}

h4.from-to {display: flex;gap: 50px;}

h4.from-to span strong {font-size: 12px;margin-right: 3px;color: #8f8f8f;}

h4.from-to {}

h4.from-to span {font-size: 16px;} 
/***** My reportees Eyes css end **************/






/******** review PMS Start******/
.reportees-eye.review-pms {grid-template-columns: 100%;}

.perf-mbottom li {margin-bottom: 12px;}

.perf-mbottom li:last-child {margin-bottom: 0;}

.perf-mbottom ul {margin-bottom: 0;}

.pmstable textarea {height: 60px;}

.pms-w-200 > div {width: 200px;}

.pms-w100 > div {width: 100px;}

.pms-w100 input {width: 100%;padding: 8px;
    border-radius: 6px;
    border: 1px solid #cad3d9;
    background: #fafafa;
    width: 100%;height: 52px;}

.pms-w100 select {padding: 8px;
    border-radius: 6px;
    border: 1px solid #cad3d9;
    background: #fafafa;
    width: 100%;height: 52px;}

.individual-ticket-details {}
.table-height-fix
{
    overflow: auto;
    height: 400px;
}

.table-height-fix th {
    position: sticky;
    top: 0;
    z-index: 1;
    background: #ececec;
}
 




/******** review PMS end******/

/**** after login popup css start ***/
.chkk form {display: flex;align-items: center;gap: 5px;}

.chkk form p {margin-bottom: 0;}

.chkk {padding-bottom: 10px;}


.box-shape.onload {
    height: unset;
    overflow: unset;
}



/**** after login popup css end ***/


.radioWrap.newradio tr {
    display: flex;
    gap: 30px;
    align-items: center;
}

.radioWrap.newradio tr td {
    display: flex;
    align-items: center;
    gap: 5px;
}

.radioWrap.newradio tr td label {
    margin-bottom: 0px;
    top: 0px;
}



/**************** add by Rohan ***************/

 .common-table-class th {
    font-size: 14px;
}
.common-table-class th {
    font-weight: 800;
    color: #000;
    padding: 20px;
    padding: 25px 15px;
    font-size: 16px;
}
.common-table-class th a { 
    color: #000; 
}
.common-table-class th {
    background: #ececec;
}

.datepicker > .datepicker-days { display:block;   }

.labelTempClass {
    position: relative;
    top: 4px;
}
.requiredFeilds
{
    color:red;
}

.successPopup .modal-header {
    position: absolute;
    right: 0;
    border: none;
    z-index: 9;
}

.successPopup .modal-body {
    padding-top: 50px;
    text-align: center;
    padding-bottom: 50px;
}

.successPopup .modal-body h2 {
    padding-bottom: 0px;
    color: #8f8e8e;
    font-weight: 400;
}

.successPopup .modal-body i {
    font-size: 40px;
    margin-bottom: 20px;
    color: #48cc62;
}

.successPopup .modal-body h3 {
    font-size: 30px;
}
.successPopup .modal-body i.fas.fa-times-circle
{
    color:red;
}

.radioPdiv {
    justify-content: center;
}


.heightScroll10 {
    height: 500px;
    overflow-y: scroll;
}

.newBlueBtn {
    background: #299cee;
    border: 1px solid #299cee;
}

.newBlueBtn:hover {
    background: none;
    border: 1px solid #299cee;
    color: #299cee !important;
}

.emailwrap {
    overflow-wrap: anywhere;
    width: 100px;
    display: block;
    font-size: 13px;
}
/**************** end by Rohan ***************/








@media only screen and (max-width: 1400px) and (min-width: 1300px)
{
 .login-logo img {
    width: 20%;
}
 .login-left-section { 
    padding: 15px 0px;
}
 .login-right-section { 
    padding: 15px 150px;
}
	.final-remark-grid form { 
    grid-template-columns: 65% 32%;  
}
.final-remark-grid { 
    grid-template-columns: 14% 84%; 
}	
.w-40 {
    width: 60%; 
}

.w-250 {
    width: unset !important;
}
.three-input-feild { 
    gap: 10px;
}
.e-join-login-grid .login-left-content figure img {
    width: 55%;
}
.e-join-login-grid .login-left-content { 
    padding: 0px 30px 0px 40px;
}
.e-join-login-grid .login-left-content ul li {
 
    width: 92%; 
}

.e-join-login-grid .login-left-content h3 { 
    width: 100%; 
}
.final-submission .profile-grid-content li {
    grid-template-columns: 20% 20%;
    gap: 0;
}















}


@media only screen and (max-width: 1280px) and (min-width: 1150px)
{
	.final-remark-grid form { 
    grid-template-columns: 65% 32%;  
}
.final-remark-grid { 
    grid-template-columns: 14% 84%; 
}	
.attenedence-inside-grid { 
    grid-template-columns: 16% 82%; 
}	
.date-day-table h4 { 
    width: 90px;
}	
.regutextarea textarea { 
    width: 200px;
}	
	.hrs {
    width: 80px;
}
.profile-top-left { 
    grid-template-columns: 16% 81%;
    gap: 1%;
}
.profile-information { 
    grid-template-columns: 26% 16% 23% 19% 16%;
}
.tabtotab-grid { 
    grid-template-columns: 16% 79%; 
}
.profile-right-container { 
    grid-template-columns: 49% 49%; 
}
.w-40 {
    width: 60%; 
}
.w-250 {
    width: unset !important;
}

.tick-width {
    width: 150px;
}
.mobile-width-150{
    width: 140px;
}

.mobile-width-70{
    width: 70px;
}
.ticket-form-grid input {
    width: 100% !important;
}
.stage-ticket {
    width: unset;;
}
.common-table-class td {
    font-size: 14px;
}

.three-input-feild { 
    gap: 5px;
}
.e-join-login-grid .login-left-content figure img {
    width: 55%;
}
.e-join-login-grid .login-left-content { 
    padding: 0px 30px 0px 40px;
}
.e-join-login-grid .login-left-content ul li {
 
    width: 92%; 
}

.e-join-login-grid .login-left-content h3 { 
    width: 100%; 
}
.padding-50-20 {
    padding: 20px 20px;
}
.birthday-box { 
    gap: 10px; 
}
.login-logo img {
    width: 80px;
}
.login-logo { 
    margin-bottom: 15px;
}
.powered-by { 
    margin-top: 10px;
}
.login-copyright {
    margin-top: 14px;
}
.sidebar-menu {
    padding: 12px; 
}
.w-60
{
	width:60px;
}
.final-submission .profile-grid-content li {
    grid-template-columns: 20% 20%;
    gap: 0;
}



} /* 1150 - 1280 */




@media only screen and (max-width: 1500px) and (min-width: 1401px)
{
.final-remark-grid { 
    grid-template-columns: 14% 83%; 
}

.w-40 {
    width: 60%; 
}

.w-250 {
    width: unset !important;
}

.final-submission .profile-grid-content li {
    grid-template-columns: 20% 20%;
    gap: 0;
}




}




/****** Mobile Responsive ****/
@media (max-width:991px) { 
.login-grid {
    grid-template-columns: 100%;
    height: unset;
    overflow: unset;
}

.login-left-content h2 {
    width: 90%;
}

.login-left-content p {
    width: 90%;
}

.login-left-content {}

.login-right-section {
    order: 1;
    padding: 30px  
 20px;
}

.login-left-section {
    order: 2;
}	
	ul.navbar-nav.sidebar .sidebar-menu {
    display: none;
}

ul.navbar-nav.sidebar.toggled .sidebar-menu {
    display: block;
}
.main-bg {
    padding-top: 30px;
    padding-bottom: 40px;
}	
	
	.attenedence-inside-grid {
    grid-template-columns: 100%;
    padding-bottom: 25px;
}

.attenedence-inside-grid form {
    display: grid;
    grid-template-columns: 44% 44%;
    gap: 8%;
}

.attenedence-inside-grid   .month-selection {
    width: 100%;
}

.month-section {}

.attenedence-inside-grid .month-section {
    width: 100%;
}

.attenedence-inside-grid  button {
    width: 100%;
    font-size: 14px;
    padding: 6px 10px;
}

.date-section-grid {
     gap: 10px;
    overflow: scroll;
     width: 100%;
}

.date-data {width: 100%;width: 70px;}
	
.date-day-table {
    width: 85px;
}	
.regularize select { 
    width: 100%;
}	
	.final-remark-grid {
    grid-template-columns: 100%;
    gap: 6%;
}

.final-remark-grid form {
    grid-template-columns: 100%;
    gap: 10%;
}

.common-table-class thead th {
    padding: 25px 15px;
}
	.profile-image img {
    width: 53px;
    height: 53px;
}

.tabtotab-grid {
    padding: 15px 15px;
    grid-template-columns: 100%;
}

.profile-tab li a {
    padding: 15px 15px;
    font-size: 15px;
}

.nav-tabs {
    width: 100%;
}

.tab {
    display: flex;
    overflow: scroll;
}

.tab {}

.tabtotab-grid {}

.tab button {
    width: max-content;
    padding-bottom: 15px !important;
}

.tab div {
    margin-top: 20px;
    display: flex;
    gap: 20px;
}

.profile-right-container {
    grid-template-columns: 100%;
    gap: 0%;
}.profile-right-container {}

.profile-grid-content ul li {
    margin-bottom: 15px;
}

.profile-grid-content ul {
    margin-bottom: 0;
}
.desktop-show
{
display:none;
}	
.mobile-show
{
display:block;
}		
.profile-top-left {
    grid-template-columns: 100%;
}

.profile-image {
    display: flex;
    gap: 15px;
}

.profile-user-name.mobile-show a {
    display: unset;
}

.profile-user-name.mobile-show .view-all {
    margin-top: 10px;
}

.profile-information {
    grid-template-columns: repeat(2, 1fr);
    gap: 25px;
    justify-content: space-between;
}	
	
.tabtotab-grid .tab button {  
    gap: 10px;
}	
.h1-flex {
    display: unset;
}

.h1-right {
    justify-content: space-between;
    margin-bottom: 25px;
}

.leave-grid {
    grid-template-columns: 100%;
}

.attendence-section.box-shape.leave-grid h2 {
    margin-bottom: 0px;
    border-bottom: none;
    padding-bottom: 15px;
}	
.w-40 {
    width: 100%; 
}	
h1 span { 
    margin-bottom: 18px;
}	
	.hrs {
    width: 80px;
}
.regutextarea textarea { 
    width: 200px;
}	
.modal-content .modal-body .form-input .modal-form-grid { 
    grid-template-columns: repeat(1, 1fr); 
}	
.upload-employ .form-button {
    display: flex; 
}

.mobile-flex {
    flex-wrap: nowrap;
    overflow-y: scroll;
}

.mobile-flex a {
    white-space: nowrap;
}

ul.nav.nav-tabs.profile-tab.mobile-flex {}

.ticket-form-grid {
    padding: 15px !important;
}

.ticket-form-grid form {
    grid-template-columns: 100%;
}

form.assigned-me {}

.ticket-form-grid form > div {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

div {}

.ticket-form-grid .month-section select {
    width: 100% !important;
}

select.w-250 {}

.tick-width {
    width: 180px;
}
.mobile-width-150{
    width: 150px;
}

.mobile-width-70{
    width: 70px;
}
.ticket-form-grid input {
    width: 100% !important;
}

.individual-ticket-grid:nth-child(odd) {
    text-align: right;
}.individual-ticket-grid {
    grid-template-columns: 50% 50%;
}

.individual-ticket-grid .individual-ticket-details:nth-child(even) {
    text-align: right;
}

.individual-ticket-details {
    margin-bottom: 10px;
}

.indi-tic-tab {
    flex-wrap: unset;
    overflow-x: scroll;
    overflow-y: hidden;
}

.indi-tic-tab li {
    /* width: 880px; */
}

.indi-tic-tab a {
    white-space: nowrap;
}


 

.approve-resignation .m-150 div {width: 140px !important;}

.profile-grid-content ul li { 
    grid-template-columns: 35% 56%;
}
.three-input-feild { 
    gap: 6px;
}
.e-join-login-grid .login-left-content { 
    padding: 0px 20px 0px 20px;
}
.e-join-login-grid .login-left-section {
    padding-top: 30px;
}
.e-join-login-grid .login-left-content h3 { 
    width: 100%; 
}
.login-form-container .form-button { 
    margin-bottom: 20px;
}
.camera-area { 
    height: 190px; 
}
.camera {
    display: unset; 
}
.ejoin-document-container { 
    grid-template-columns: 100%; 
}
p.grid-below-p {width: 100%;}

.companyinformation p {width: 100%;}

.companyinformation form input {width: 38px;/* height: 20px; */}

input[type="checkbox"] {}

.emp-ins-three-grid {grid-template-columns: 100%;}

ul.emp-ins-three-grid {}

.emp-inv-dec-modal .profile-grid-content ul {display: block;}

ul {}


} /** 991*/













.table-responsive>.table-bordered {margin-bottom: 0;}

.ticket-table .table-responsive {padding-bottom: 0;
    margin-bottom: 0;}