/* 1 General */
@font-face{
    font-family:Segoe UI;
    src: url(../webfonts/SEGOEUI.TTF) format("truetype");
    }
* {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}
body{
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif!important;
}
@media only screen and (min-width:1024px){
  .verticalLine {
    left: 3.5%!important;
}
}
@media only screen and (max-width:480px){
    html, body{
    width:100%;
    height:100%;
    margin:0;
    padding:0;
    overflow-X:hidden;
    }}

    @media screen and (max-width:900px) and (min-width:481px){
    html, body{
    width:100%;
    height:100%;
    margin:0;
    padding:0;
    overflow-X:hidden;
    }}
:root {
    /* Background Color */
    --primary-color: #6e9b13;
    --bg-dark: #838383;
    --bg-light: #f9f6f1;

    /* Text Style */
    --primary-text: #6e9b13;
    --text-white: #fff;
    --text-black: #222;
    --text-gray: #666;
    --text-light: #ddd;
}
a.link {
  color: #547512;
}
body {
    font-family: 'Open Sans';

}
::-webkit-scrollbar {
  width: 0.5rem;
}

::-webkit-scrollbar-tack {
  background-color: #547512;
}

::-webkit-scrollbar-thumb {
background-color: #547512;
} 
.wrapper{
  max-width: 820px;
  margin: 0 auto;
}
a {
    text-decoration: none;
}
/*
::-webkit-scrollbar {
    width: .375rem;
}

::-webkit-scrollbar-track {
    background: var(--bg-light-blue);
}

::-webkit-scrollbar-thumb {
    background: var(--secondary-color);
} */
.theme-color{
  color: #7eb216;
}
.text-right{
text-align: right!important;
}

h1{
    font-size: 3.875rem;
    margin-bottom:1.25rem;
    font-weight: 600;
}
h2{
    font-size: 2.875rem;
    font-weight: 600;
}
h3{
    font-size: 2.25rem;
    font-weight: 600;
}
h4{
    font-size: 1.5rem;
    font-weight: 600;
    line-height: 2.25rem;
}
h5{
    font-size: 1.5rem;
    line-height: 1.2;
    font-weight: 500;
}
h6{
    font-size: .875rem;
    font-weight: 300;
}
p{
    font-size: 14px;
    line-height: 1.625rem;
}

/* LOGIN PAGE CSS START */
.loginheader{
    background: url(../images/BG.png);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
    width: 100%;
    min-height: 100vh;
    /* align-items: center; */
    padding-top: 100px;
    display: flex;
    justify-content: center;
    text-align: center;
}
.loginlogo{
    width: 150px;
    text-align: center;
    margin: 0px auto 30px auto;
}
.loginform{
  width:350px;
}
.single-input{
    width: 100%;
    border:1px solid #c1c1c1;
    display: flex;
    margin: 0 auto 0px auto;
    background-color: #fff;
    padding: 4px 5px;
    border-radius: 4px;
  }
  input{
    border:1px solid #ced4da;
    padding: 0.375rem 0.75rem;
    font-size: 14px;
    font-weight: 400;
    line-height: 1.5;
    color: #212529;
    background-color: #fff;
    background-clip: padding-box;
  }
  .single-input i{
    padding: 8px 16px;
    color: #0cd6a8;
  }
  .single-input input{
    border:0px solid #c1c1c1;
    width: 100%;
    outline: none;
    height: 30px;
    font-size: 16px;
  }
  .clear-both{
    clear: both;
  }
  .text-danger{
    float: left;
    padding: 3px 0;
  }
  .loginusericon {
    width: 20px;
    margin: 0px 15px 0 5px;
}
  .loginusericon{
    width: 20px;
    margin: 0 15px 0 5px;
  }
.loginpassicon{
    width: 17px;
    margin: 0 17px 0 5px;
}
  .primary_btn{
    background-image: linear-gradient(rgba(126, 178, 22, 0), rgba(0, 0, 0, 0.1));
    background-color: #7eb216;
    border-color: #6e9b13 #6e9b13 #3e570b;
    border-color: rgba(0, 0, 0, 0.05) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.15);
    color: white;
    text-shadow: 1px 1px 0 rgb(0 0 0 / 15%);
    padding: 8px 20px;
    border-radius: 4px;
    display: inline-block;
    margin: 5px auto;
    font-size: 16px;
    line-height: 24px;
  }
  .primary_btn2{
    background-image: linear-gradient(rgba(126, 178, 22, 0), rgba(0, 0, 0, 0.1));
    background-color: #547512;
    border-color: rgba(0, 0, 0, 0.05) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.15);
    color: white;
    text-shadow: 1px 1px 0 rgb(0 0 0 / 15%);
    padding: 8px 20px;
    border-radius: 4px;
    display: inline-block;
    margin: 10px auto 5px auto;
    font-size: 16px;
    line-height: 24px;
  }
  .loginheader .form-group {
    display: block;
    margin-bottom: 15px;
    text-align: left;
  }

  .loginheader .form-group input {
    padding: 0;
    height: initial;
    width: initial;
    margin-bottom: 0;
    display: none;
    cursor: pointer;
  }

  .loginheader .form-group label {
    position: relative;
    cursor: pointer;
  }

  .loginheader .form-group label:before {
    content: "";
    -webkit-appearance: none;
    background-color: transparent;
    border: 2px solid #7eb216;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05),
      inset 0px -15px 10px -12px rgba(0, 0, 0, 0.05);
    padding: 8px;
    display: inline-block;
    position: relative;
    vertical-align: middle;
    cursor: pointer;
    margin-right: 5px;
  }

  .loginheader .form-group input:checked + label:after {
    content: "";
    display: block;
    position: absolute;
    top: 8px;
    left: 8px;
    width: 5px;
    height: 10px;
    border: solid #7eb216;
    border-width: 0 2px 2px 0;
    transform: rotate(45deg);
  }
  span.theme-color{
    color: #56731B;
  }

  .btn-close {
    box-sizing: content-box;
    width: 1em;
    height: none!important;
    padding: 0.25em 0.25em;
    color: #000;
    background: none;
    border: 0;
    border-radius: 0.375rem;
    opacity: 0.8;
    font-size: x-large;
}
.modal-header .btn-close {
  padding: calc(var(--bs-modal-header-padding-y) * .5) calc(var(--bs-modal-header-padding-x) * .5);
  margin: calc(-1.8 * var(--bs-modal-header-padding-y)) calc(-.5 * var(--bs-modal-header-padding-x)) calc(-.5 * var(--bs-modal-header-padding-y)) auto!important;
}
.btn-close, .btn-close:focus{
  outline: none;
  border: none;
  box-shadow: none;
}
/* LOGIN PAGE CSS END */
/* Navbar CSS START */

button.navbar-toggler,
button.navbar-toggler:focus {
    box-shadow: none;
    border: none;
    outline: none;
    color:#fff;
}
a.navbar-brand {
  color: #fff;
}
.navbar-brand
{
    text-align: center;
    margin: auto;
}
nav.navbar{
  background-color: #56731B!important;
}

/* Navbar CSS END */

/* HOME PAGE CSS START */
img.mikeicon {
  width: 18px;
}
img.mikeicon2 {
  width: 22px;
}
img.scheduleicons {
  width: 70px;
  height: 70px;
}
.rescheduleattendance{
  width: 100%;
  height: 130px;
  background-color:#D1CFC2 ;
  border-radius: 6px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  margin-bottom: 10px;
}
.rescheduleattendance h2{
color:#000 ;
font-size: 1rem;
font-weight: 600;
margin: 10px auto 0 auto;
}
.cancelattendance{
width: 100%;
height: 130px;
background-color:#7A8427 ;
border-radius: 6px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
text-align: center;
margin-bottom: 10px;
}
.cancelattendance h2{
color:#fff ;
font-size: 1rem;
font-weight: 600;
margin: 10px auto 0 auto;
  }
.followup{
width: 100%;
height: 130px;
background-color:#8D9981 ;
border-radius: 6px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
text-align: center;
margin-bottom: 10px;
  }
.followup h2{
color:#fff ;
font-size: 1rem;
font-weight: 600;
margin: 10px auto 0 auto;
    }

.todayschedule{
width: 100%;
height: 130px;
background-color:#DEE6D4;
border-radius: 6px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
text-align: center;
margin-bottom: 10px;
}
.todayschedule h2{
color:#000 ;
font-size: 1rem;
font-weight: 600;
margin: 10px auto 0 auto;
}
.cancelappointment{
  width: 100%;
  height: 130px;
  background-color:#D0D3A0;
  border-radius: 6px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  margin-bottom: 10px;
  }
  .cancelappointment h2{
  color:#000 ;
  font-size: 1rem;
  font-weight: 600;
  margin: 10px auto 0 auto;
  }
  .rescheduleappoinment{
    width: 100%;
    height: 130px;
    background-color:#837546;
    border-radius: 6px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    margin-bottom: 10px;
    }
    .rescheduleappoinment h2{
    color:#fff ;
    font-size: 1rem;
    font-weight: 600;
    margin: 10px auto 0 auto;
    }

    .transportationschedule{
      width: 100%;
      height: 130px;
      background-color:#969696;
      border-radius: 6px;
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      text-align: center;
      margin-bottom: 10px;
      }
      .transportationschedule h2{
      color:#fff ;
      font-size: 1rem;
      font-weight: 600;
      margin: 10px auto 0 auto;
      }

      
    .clientdirectory{
      width: 100%;
      height: 130px;
      background-color:#AAB25F;
      border-radius: 6px;
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      text-align: center;
      margin-bottom: 10px;
      }
      .clientdirectory h2{
      color:#000;
      font-size: 1rem;
      font-weight: 600;
      margin: 10px auto 0 auto;
      }


/* The side navigation menu */
.sidenav {
  height: 100%; /* 100% Full-height */
  width: 0; /* 0 width - change this with JavaScript */
  position: fixed; /* Stay in place */
  z-index: 999; /* Stay on top */
  top: 0; /* Stay at the top */
  left: 0;
  background-color: #fff; /* Black*/
  overflow-x: hidden; /* Disable horizontal scroll */
  padding-top: 20px; /* Place content 60px from the top */
  transition: 0.1s; /* 0.2 second transition effect to slide in the sidenav */
}

/* The navigation menu links */
.sidenav a {
  padding:0;
  text-decoration: none;
  font-size: 16px;
  color: #000;
  display: block;
  transition: 0.3s;
  border-bottom: 1px solid #ccc;
}
.sidenav a.active {
  background-color: #56731B;
  color: #fff;
}
/* Position and style the close button (top right corner) */
.sidenav .closebtn {
  position: absolute;
  top: 0;
  right: 25px;
  font-size: 36px;
  margin-left: 50px;
}
/* On smaller screens, where height is less than 450px, change the style of the sidenav (less padding and a smaller font size) */
@media screen and (max-height: 450px) {
  .sidenav {padding-top: 15px;}
  .sidenav a {font-size: 14px;}
}
.sidenavicon {
  color: #fff;
  cursor: pointer;
  font-size: 18px;
}
.iconbox img{
  width: 25px;
  font-size: 12px;
}
.iconbox {
  width: 50px;
  height: 50px;
  background-color: #f9f6f1;
  display: flex;
  z-index: 999;
  align-items: center;
  justify-content: center;
}
.iconbox.active{
  /* background-color: #648A16; */
  /* color: #fff; */
}
.profileiconbox img{
  width: 60px;
  height: 60px;
border-radius: 100px;
border: 1px solid #fff;
}
span.username.theme-color {
  font-size: 20px;
}
.border-none{
  border: none!important;
}
@media (min-width: 768px) and (max-width: 1023px){
  .transportationschedule h2{
    font-size: 1rem;
  }
  img.profilepic{
    width: 100px!important;
    height: 100px!important;
  }
  .col-width-90 {
    width: 94%!important;
}
  .col-width-10 {
    width: 6%!important;
}
.verticalLine {
  left: 4%!important;
}
.attendancescheduleprofilebox.tab {
  justify-content: end!important;
}
.padding-five{
  padding: 5px!important;
}
.fourcolbox{
width: 102%!important;
}
}
/* HOME PAGE CSS END */
/* RESCHEDULE ATTENDANCE PAGE CSS START */
/* .input-group-text{
  padding: 10px;
} */
span.input-group-text.calendericonbox{
  border-radius: 0 0.375rem 0.375rem 0;
  cursor: pointer;
}
span.input-group-text.calendericonbox.two{
  border-radius: 0 0.375rem 0.375rem 0;
  padding: 10px;
  /* cursor: pointer; */
}
input.form-control:hover,input.form-control:focus,select.form-select:hover,select.form-select:focus{
  outline: none;
  box-shadow: none;
}
@media (min-width: 320px) and (max-width: 480px){
  .single-input{
    width: 100%;
  }
  p.physinfo {
    color: #000;
    font-size: 14px;
}
.ml-minus25{
  margin-left: 0px!important;
}
.ml-minus30{
  margin-left: 0px!important;
}
p.pysname{
  font-size: 16px!important;
}
.row.facesheetboxone {
  font-size: 14px!important;
}
button.btn1,button.btn2,button.btn3,button.btn4 {
  font-size: 14px;
}
.attendanceschedulemainbox.calendar {
  line-height: 36px;
}
button.btn5,button.btn6{
  padding: 4px 8px!important;
  font-size: 14px;
  width: 110px!important;
}.btndemo{
  padding: 4px!important;
}
  p.apponttext{
    font-size: 11px!important;
    margin-bottom: 0px!important;
  }
  .fs-5 {
    font-size: 1rem!important;
}
.pagifloat{
  display: flex!important;
  align-items: center!important;
  justify-content: center!important;
  margin: 10px auto!important;
}
.pagialignleft{
  text-align: center!important;
  display: flex!important;
  justify-content: center!important;
  align-items: center!important;
}
.pagialignright{
  text-align: center!important;
}
h6.mb-0.attending,h6.pysinfo {
  font-size: 1rem!important;
}

.primary_btn2,.secondary_btn2{
  /* padding: 4px 8px!important; */
  padding: 4px 22px!important;
  font-size: 14px!important;
    margin: 10px auto 10px auto;
}
.margtopminus-5{
  margin-top: -5px!important;
}
a.navbar-brand {
  color: #fff;
  font-size: 16px!important;
}
.select2-container--bootstrap-5 .select2-selection--single .select2-selection__rendered{
  font-size: 14px!important;
}

}
@media only screen and (max-width: 480px)
{
  .m-2 {
    margin: 0.1rem 0.1rem !important;
}
.select2-container--bootstrap-5 .select2-selection{
  width: 100%!important;
}
}

@media only screen and (max-width: 320px)
{
.select2-container--bootstrap-5 .select2-selection{
  width: 84%!important;
}
.verticalLine{
  left: 9.1%!important;
}
}
.select2-container--bootstrap-5 .select2-selection--single .select2-selection__rendered{
  font-size: 16px;
}
.input-group.width97{
  width: 97.5%!important;
}
.attendanceschedulemainbox{
  background-color: #f9f6f1;
  /* border: 1px solid #b2afaa; */
  border-radius: 10px;
  display: flex;
}
.attendanceschedulemainbox2{
  background-color: #f9f6f1;
  /* border: 1px solid #b2afaa; */
  border-radius: 10px;
  display: flex;
  justify-content: center;

}
.attendanceschedulemainbox_followup{
  background-color: #f9f6f1;
  /* border: 1px solid #b2afaa; */
  border-radius: 10px;
  display: block!important;
}
.fs-5 {
  font-size: 1.10rem;
}
.attendanceschedulename{
  padding: 4px;
  background-color: #7eb216;
  height: 50px;
    border-radius: 6px;
    align-items: center;
    display: flex;
    justify-content: center;
}
.attendanceschedulename h6{
  font-size: 14px;
  font-weight: 600;
  color: #fff;
}
svg.svg-inline--fa.fa-microphone {
  color: #000;
}
/* svg.svg-inline--fa.fa-magnifying-glass path{
  font-size: 10px!important;
} */
svg.svg-inline--fa.fa-magnifying-glass.two{
  color: #fff;
  background-color: #547512;
  width: 20px;
  height: 20px;
  border-radius: 100px;
  padding: 4px;
}
svg.svg-inline--fa.fa-calendar-days.two{
  color: #fff;
  background-color: #547512;
  width: 15px;
  height: 15px;
  border-radius: 100px;
  padding: 4px;
}
.border-left-zero{
  border-left: 0px;
}
.border-right-zero{
  border-right: 0px;
}
.padding-left-zero{
  padding-left: 0px;
}
.padding-left-five{
  padding-left: 5px;
}
.padding-right-five{
  padding-right: 5px;
}
.padding-right-zero{
  padding-right: 0px;
}
.border-radius-cust{
  border-radius: 4px;
  border-right: none!important;
}
/* .input-group-text-transparent{
  background: transparent;
} */
img.profilepic {
  width: 70px;
  height: 70px;
  border-radius: 100px;
  object-fit: cover;
  object-position: center;
  border: 1px solid #fff;
}
img.sheduleicon{
  width: 30px;
  height: auto;
  margin-right: 5px;
}
img.sheduleicon2{
  width: 30px;
  height: auto;
  margin-right: 8px;
}
img.sheduleicon4{
  width: 30px;
}
img.sheduleicon3{
  width: 30px;
  height: auto;
}
img.sheduleicon5 {
  width: 30px;
  height: auto;
  position: absolute;
  z-index: 1;
}
.col-width-10{
  width: 10%;
}
.col-width-90{
  width: 90%;
}
.profilebox {
  display: flex;
  /* align-items: center; */
  width: 100%;
  justify-content: center;
  align-items: center;
  margin-top: 14px;
}
.attendancescheduleprofilebox {
  display: flex;
  /* align-items: center; */
  width: 100%;
  justify-content: center;
}
.attendancescheduleprofilebox2 {
  display: flex;
  width: 100%;
  justify-content: center;
}
.attendancescheduledetails a{
  color: #000; /*#547512;*/
  text-decoration: none;
}
.attendancescheduledetails2 a{
  color: #547512;
  text-decoration: none;
}
.pl-20 {
  padding-left: 20px;
}
.pl-minus20{
  padding-left: -20px;
}
p.date {
  font-size: 14px;
  font-weight: 600;
  color:#000;
}
p.time {
  font-size: 14px;
  font-weight: 600;
  color:#000;
}
h6.pname {
  font-size: 16px;
  font-weight: bold;
}
h6.pname2 {
  font-size: 16px;
  font-weight: 500;
}
h6.dname {
  font-size: 18px;
  font-weight: 700;
  color: #547512;
}
button.btn0 {
  background-color: #547512;
  color: #fff;
  padding: 4px 8px;
  text-align: center;
  margin: 0 auto;
  border-radius: 7px;
  border: none;
  width: 100px;
}
.btndemo{
  background-color: #969696;
  color: #fff;
  padding: 8px;
  text-align: center;
  margin: 0 auto;
  border-radius: 7px;
  border: none;
  width: 200px;
}
button.btn1 {
  background-color: #969696;
  color: #fff;
  padding: 8px 16px;
  text-align: center;
  margin: 0 auto;
  border-radius: 7px;
  border: none;
  width: 100%;
}
button.btn2 {
  background-color: #7A8427;
  color: #fff;
  padding: 8px 16px;
  text-align: center;
  margin: 0 auto;
  border-radius: 7px;
  border: none;
  width: 100%;
}
button.btn3 {
  background-color: #837546;
  color: #fff;
  padding: 8px 16px;
  text-align: center;
  margin: 0 auto;
  border-radius: 7px;
  border: none;
  width: 100%;
}
button.btn4 {
  background-color: #BEC092;
  color: #fff;
  padding: 8px 16px;
  text-align: center;
  margin: 0 auto;
  border-radius: 7px;
  border: none;
  width: 100%;
}
button.btn5 {
  background-color: #6B5D2B;
  color: #fff;
  padding: 8px 16px;
  text-align: center;
  margin: 0 auto;
  border-radius: 7px;
  border: none;
  width: 100%;
}
button.btn6 {
  background-color: #ABB05C;
  color: #fff;
  padding: 8px 16px;
  text-align: center;
  margin: 0 auto;
  border-radius: 7px;
  border: none;
  width: 100%;
}
.mainbox{
  background-color: #f9f6f1;
    border-radius: 10px;
    padding: 10px;
    margin: 10px 0;
}
/* RESCHEDULE ATTENDANCE PAGE CSS END */

@media only screen and (min-width: 900px){
  .wrapper{
    max-width: 820px;
    margin: 0 auto;
    position: relative;
  border: 1px solid #BFBFBF;
  background-color: white;
  box-shadow: 0px 0px 15px #aaaaaa;
  }
  img.profilepic{
    width: 100px!important;
    height: 100px!important;
  }
  .col-width-10 {
    width: 5%;
}
.col-width-90 {
  width: 95%;
}
.attendancescheduleprofilebox.tab {
  justify-content: end!important;
}
.padding-five{
  padding: 5px;
}
.padding-left-15{
  padding-left: 15px!important;
  }
  .padding-right-15{
    padding-right: 15px!important;
    }
}

/* POPUP CSS START */
.modal-header.notattendance {
  background-color: #FF0505;
  text-align: center;
}
button.btn-close,button.btn-close:hover {
  color: #fff;
} 
.modal-header.notattendance h1,.modal-header.updateshift {
  text-align: center;
  color: #fff;
}
h6.pysinfo{
  text-align: center;
  color: #547512;
  text-transform: uppercase;
  font-size: 1rem;
  font-weight: 600;
  margin-bottom: 0px;
}
p.pysname{
  margin-bottom: 0px;
  font-size: 16px!important;
  text-transform: uppercase;
  color: #fff;
}
p.pysinfo{
  margin-bottom: 0px;
  font-size: 16px;
  color: #000;

}
h6.mb-0.attending {
  text-align: center;
  color: #547512;
  text-transform: uppercase;
  font-size: 1.2rem;
  font-weight: 600;
}
.attendingbox{
  border-radius: 5px;
  border: 1px solid #7C7777;
  min-height: 100px;
  height: auto;
  width: 100%;
  padding: 5px;
  font-size: 1rem;
}
.modal-header.updateshift {
  background-color: #547512;
}
img.contactifoicon {
  width: 30px;
}
.emergencyinfomainbox{
  background-color: #f9f6f1;
  /* border: 1px solid #b2afaa; */
  border-radius: 4px;
  display: flex;
  padding: 12px;
  margin: 10px 0;
}
p.info a{
  color: #000; /*#547512;*/
  text-decoration: none;
  font-size: 14px;
}
p.info{
 font-size: 14px;
 color: #000;
}
svg.svg-inline--fa.fa-angle-left {
  font-size: 20px;
  color: #fff;
}
b.notetext{
  font-size: 14px;
}
.notediv{
  border-radius: 4px;
  border:1px solid #7C7777;
  min-height: 150px;
  height: auto;
  width: 100%;
}
.border-radius-4{
  border-radius: 4px!important;
}
/* POPUP CSS END */

/* CALENDER UI CSS START */
.picker--focused .picker__day--selected, .picker__day--selected, .picker__day--selected:hover{
  background-color: #547512!important;
  color: #fff!important;
}
.picker--focused .picker__day--highlighted{
  background-color: #547512!important;
  color: #fff!important;
}
.picker__day--infocus:hover,.picker__day--outfocus:hover{
  background-color: #547512!important;
  color: #fff!important;
}
.picker__nav--next:hover, .picker__nav--prev:hover,.picker__button--clear:hover, .picker__button--close:hover, .picker__button--today:hover{
  background-color: #e9ecef!important;
}
.picker__day--highlighted{
  border-color:#547512!important;
}
.picker__day--today:before{
  border-top:.5em solid #fff!important;
}
.nav-tabs .nav-item.show .nav-link, .nav-tabs .nav-link.active{
  border-bottom: 3px solid #547512;
  color: #547512!important;
}
.nav-tabs .nav-link a{
  color:#000;
}
button.nav-link{
  color:#000;
}
p.apponttext{
  font-size: 14px;
  margin-bottom: 0px;
}
.fourcolbox{
  background-color: #EAE2D9;
  box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
border-radius: 50px 0px 0px 50px;
padding: 0.5rem;
width: 103.5%;
display: flex;
margin: 10px 0 5px 0;
}
.physmainbox{
  background-color: #f9f6f1;
    border-radius: 10px;
    margin: 10px 0;
}
.mainheader {
  background-color: #547512;
  padding: 10px;
  border-radius: 10px 10px 0 0;
}
.pysmaincontent{
  padding: 0 10px 10px 10px;
}
p.physinfo b{
  color: #000;
  font-weight: bold;
  font-size: 14px;
}
p.physinfo{
  color: #000;
  font-size: 14px;
}
.physdetails{
  display: flex;
  flex-direction: column;
  align-items: strat;
  justify-content: center;
  color: #fff;
}
/* APPOINTMENT CSS START */
.calenderheader {
  /* background-color: #445E10; */
  min-height: 60px;
  height: auto;
  display: flex;
  align-items: center;
  justify-content: center;
}
.calenderheader .svg-inline--fa, .calenderheader svg.svg-inline--fa.fa-microphone{
  color: #000;
}
input.form-control.border-left-zero.calendar {
  background-color: #fff;
  color: #000;
}
/* .calenderheader span.input-group-text.calendericonbox{
  background-color: transparent;
  color:#fff;
} */
.calenderheader ::placeholder{
  color: #000;
  font: 12px;
}
.row.facesheetboxone {
  position: relative;
  font-size: 16px;
}
.verticalLine {
  border-left: 2px solid #547512;
  height: 100%;
  position: absolute;
  left: 7.3%;
  margin-left: -1px;
  top: 5.5%;
  z-index: -2;
}
@media only screen and (min-width: 900px){
  .verticalLine {
    border-left: 2px solid #547512;
    height: 100%;
    position: absolute;
    left: 4%;
    margin-left: -1px;
    top: 5.5%;
    z-index: 0;
  }
  .fourcolbox {
    width: 101.7%;
  }
}
.cancel_transportation{
  color: #FFFFFF;
}

.secondary_btn2{
  background-image: linear-gradient(rgba(126, 178, 22, 0), rgba(0, 0, 0, 0.1));
  background-color: #6c757d;
  border-color: rgba(0, 0, 0, 0.05) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.15);
  color: white;
  text-shadow: 1px 1px 0 rgb(0 0 0 / 15%);
  padding: 8px 20px;
  border-radius: 4px;
  display: inline-block;
  margin: 5px auto;
  font-size: 16px;
  line-height: 24px;
}

.normal_font{
  font-weight: normal;
  font-size: 14px;
}
b.normal_font{
  font-weight: bold;
  font-size: 14px;
}
.cooming_btn{
  display: block;
    text-align: center;
}

.label_bold{
  font-weight: bold;
}

/*date and time picker css*/

 .bootstrap-datetimepicker-widget.dropdown-menu {
   border: 1px solid #34495e;
   border-radius: 0;
   box-shadow: none;
   margin: 10px 0 0 0;
   padding: 0;
   min-width: 300px;
   max-width: 100%;
   width: auto;
}
 .bootstrap-datetimepicker-widget.dropdown-menu.bottom:before, .bootstrap-datetimepicker-widget.dropdown-menu.bottom:after {
   display: none;
}
 .bootstrap-datetimepicker-widget.dropdown-menu table td, .bootstrap-datetimepicker-widget.dropdown-menu table th {
   border-radius: 0;
}
 .bootstrap-datetimepicker-widget.dropdown-menu table td.old, .bootstrap-datetimepicker-widget.dropdown-menu table td.new {
   color: #bbb;
}
 .bootstrap-datetimepicker-widget.dropdown-menu table td.today:before {
   border-bottom-color: #0095ff;
}
 .bootstrap-datetimepicker-widget.dropdown-menu table td.active, .bootstrap-datetimepicker-widget.dropdown-menu table td.active:hover, .bootstrap-datetimepicker-widget.dropdown-menu table td span.active {
   background-color: #0095ff;
   text-shadow: none;
}
 .bootstrap-datetimepicker-widget.dropdown-menu table td.active.today:before, .bootstrap-datetimepicker-widget.dropdown-menu table td.active:hover.today:before, .bootstrap-datetimepicker-widget.dropdown-menu table td span.active.today:before {
   border-bottom-color: #fff;
}
 .bootstrap-datetimepicker-widget.dropdown-menu table th {
   height: 40px;
   padding: 0;
   width: 40px;
}
 .bootstrap-datetimepicker-widget.dropdown-menu table th.picker-switch {
   width: auto;
}
 .bootstrap-datetimepicker-widget.dropdown-menu table tr:first-of-type th {
   border-bottom: 1px solid #34495e;
}
 .bootstrap-datetimepicker-widget.dropdown-menu table td.day {
   height: 32px;
   line-height: 32px;
   padding: 0;
   width: auto;
}
 .bootstrap-datetimepicker-widget.dropdown-menu table td span {
   border-radius: 0;
   height: 77px;
   line-height: 77px;
   margin: 0;
   width: 25%;
}
 .bootstrap-datetimepicker-widget.dropdown-menu .datepicker-months tbody tr td, .bootstrap-datetimepicker-widget.dropdown-menu .datepicker-years tbody tr td, .bootstrap-datetimepicker-widget.dropdown-menu .datepicker-decades tbody tr td {
   padding: 0;
}
 .bootstrap-datetimepicker-widget.dropdown-menu .datepicker-decades tbody tr td {
   height: 27px;
   line-height: 27px;
}
 .bootstrap-datetimepicker-widget.dropdown-menu .datepicker-decades tbody tr td span {
   display: block;
   float: left;
   width: 50%;
   height: 46px;
   line-height: 46px !important;
   padding: 0;
}
 .bootstrap-datetimepicker-widget.dropdown-menu .datepicker-decades tbody tr td span:not(.decade) {
   display: none;
}
 .bootstrap-datetimepicker-widget.dropdown-menu .timepicker-picker table td {
   padding: 0;
   width: 30%;
   height: 20px;
   line-height: 20px;
}
 .bootstrap-datetimepicker-widget.dropdown-menu .timepicker-picker table td:nth-child(2) {
   width: 10%;
}
 .bootstrap-datetimepicker-widget.dropdown-menu .timepicker-picker table td a, .bootstrap-datetimepicker-widget.dropdown-menu .timepicker-picker table td span, .bootstrap-datetimepicker-widget.dropdown-menu .timepicker-picker table td button {
   border: none;
   border-radius: 0;
   height: 56px;
   line-height: 56px;
   padding: 0;
   width: 100%;
}
 .bootstrap-datetimepicker-widget.dropdown-menu .timepicker-picker table td span {
   color: #333;
   margin-top: -1px;
}
 .bootstrap-datetimepicker-widget.dropdown-menu .timepicker-picker table td button {
   background-color: #fff;
   color: #333;
   font-weight: bold;
   font-size: 1.2em;
}
 .bootstrap-datetimepicker-widget.dropdown-menu .timepicker-picker table td button:hover {
   background-color: #eee;
}
 .bootstrap-datetimepicker-widget.dropdown-menu .picker-switch table td {
   border-top: 1px solid #34495e;
}
 .bootstrap-datetimepicker-widget.dropdown-menu .picker-switch table td a, .bootstrap-datetimepicker-widget.dropdown-menu .picker-switch table td span {
   display: block;
   height: 40px;
   line-height: 40px;
   padding: 0;
   width: 100%;
}
 .todayText:before {
   content: "Today's Date";
}
 

 /*pagination code css*/
 .active>.page-link, .page-link.active {
    background-color: #547512;
    border-color: #547512;
}

/* Calendar new datepicker css start */

.content {
  padding: 1rem 0; 
  background-color: beige;
}

h2 {
  font-size: 20px; }

.form-control:active, .form-control:focus {
  outline: none;
  -webkit-box-shadow: none;
  box-shadow: none; }
  .rd-day-selected, .rd-time-selected, .rd-time-option:hover {
    cursor: pointer;
    background-color: #56731B!important;
    color: #fff;
    border-radius: 50%;
}
  /* Calendar new datepicker css End */

  .mtminus25{
    margin-top: -25px;
  }

/* CUSTOM RADIO BUTTON CSS START */

[type="radio"]:checked,
[type="radio"]:not(:checked) {
  position: absolute;
  left: -9999px;
}
[type="radio"]:checked + label,
[type="radio"]:not(:checked) + label {
  position: relative;
  padding-left: 28px;
  cursor: pointer;
  line-height: 20px;
  display: inline-block;
  color: #666;
}
[type="radio"]:checked + label:before,
[type="radio"]:not(:checked) + label:before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: 18px;
  height: 18px;
  border: 1px solid #ddd;
  border-radius: 100%;
  background: #fff;
}
[type="radio"]:checked + label:after,
[type="radio"]:not(:checked) + label:after {
  content: "";
  width: 11px;
  height: 11px;
  background: #56731B!important;
  position: absolute;
  top: 3.8px;
  left: 3.4px;
  border-radius: 100%;
  -webkit-transition: all 0.2s ease;
  transition: all 0.2s ease;
}
[type="radio"]:not(:checked) + label:after {
  opacity: 0;
  -webkit-transform: scale(0);
  transform: scale(0);
}
[type="radio"]:checked + label:after {
  opacity: 1;
  -webkit-transform: scale(1);
  transform: scale(1);
}


/* CUSTOM RADIO BUTTON CSS END */

label.profile{
  font-size: 14px;
  font-weight: bold;
}
::placeholder{
  font-size: 14px;
}

/* PROFILE PAGE CSS START */
#Resetpassworddetails, #showresetdiv {
  padding: 0px;
  text-align: left;
  /* background-color: #efeeed;
  border: solid 1px #c3c3c3; */
  color: #547512;
  cursor: pointer;
  font-size: 14px;
  font-weight: bold;
}

#Resetpassworddetails {
  padding: 0px;
  display: none;
}
#Resetpassworddetails2, #showresetdiv2 {
  padding: 0px;
  text-align: left;
  /* background-color: #efeeed;
  border: solid 1px #c3c3c3; */
  color: #547512;
  cursor: pointer;
  font-size: 14px;
  font-weight: bold;
}

#Resetpassworddetails2 {
  padding: 0px;
  display: none;
}
.flex.flex-wrap.w-full.lg\:w-1\/2.justify-center {
  background-color: #efeeed;
  padding: 20px 0 5px 0 ;
}
/* PROFILE PAGE CSS END */

.pagifloat{
  display: flex;
  align-items: center;
  justify-content: end;
  margin: 10px auto;
}
.pagialignleft{
  text-align: left;
  display: flex;
  align-items: center;
  justify-content: start;
}
.pagialignright{
  text-align: right;
}
div#app {
  background-color: #efeeed;
}
.ml-minus25{
  margin-left: -25px;
}
.ml-minus30{
  margin-left: -30px;
}
.regular-text{
  font-size: 14px!important;
}
.nav-link:focus, .nav-link:hover{
  color:#000!important;
}

/*QR Scan Page CSS Start*/
h2.medheading {
    text-align: center;
    padding: 20px 0;
    color: #56731B;
    font-weight: 700;
}
span.html5-qrcode-element{
   text-align: center;
    padding: 10px 0;
    color: #56731B;
    font-weight: 700;
        text-decoration: none !important;
}
.btncontainer{
  text-align: center;
  padding: 20px 0;
}
button.btn.qrbtn {
    background-color: #547512;
    color: #fff;
    width: 100px;
    margin: 2px;
}
button.html5-qrcode-element{
    background-color: #547512;
    color: #fff;
    width: fit-content;
    margin: 2px 0px;
    border: none;
    outline: none;
    border-radius: 0.375rem;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.15), 0 1px 1px rgba(0, 0, 0, 0.075);
    font-size: 1rem;
    font-weight: 400;
    padding: 0.35rem 1rem 0.50rem 1rem;
}

@media only screen and (max-width: 767px){
  div#qr-reader__scan_region video{
    width: 100%;
  }
}
@media (min-width: 768px) and (max-width: 1024px){
  div#qr-reader__scan_region video{
    width: 100%;
  }
}

button.btn.qrbtn.active{
  border: 1px solid #547512;
  background-color: #DEE6D4;
  color: #000;
}
/*QR Scan Page CSS End*/