@import url("https://fonts.googleapis.com/css2?family=Mulish:wght@300;400;500;600;700;800;900&display=swap");
/***** general styles for pages *****/
body {
  font-family: 'Mulish', sans-serif;
  color: #484A4B;
  font-size: 16px;
  background: #F2F2F2;
  padding-bottom: 100px;
}

body.hide-scroll {
  height: 100%;
  overflow: hidden;
}

/**** container style *****/
.container {
  width: 100%;
  padding-left: 16px;
  padding-right: 16px;
}

/**** main-content style ****/
.main-content {
  background: #fff;
  border-radius: 0px 0px 60px 60px;
  padding-bottom: 60px;
  min-height: calc(100vh - 100px);
}

.main-content.home-page-content {
  background: url("../images/body-bg.svg") no-repeat center;
  background-size: 100% auto;
}

/***** buttons style *****/
.btn {
  transition: all 0.3s ease-in-out;
  box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.15);
}

.btn-warning {
  background: #F65715;
  border-color: #F65715;
  color: #fff;
}

.btn-warning:hover {
  color: #fff;
  box-shadow: none;
  background: #d04308;
}

.btn-secondary {
  background: #B6B6B6;
  border-color: #B6B6B6;
  cursor: default !important;
}


.btn-secondary:hover {
  background: #B6B6B6 !important;   /*484A4B*/
  border-color: #B6B6B6 !important; /*484A4B*/
}


/**** texts style *****/
.text-dark-blue {
  color: #00529F;
}

.text-dark-orange {
  color: #F65715;
}

/**** backgrounds style ****/
.bg-dark-blue {
  background: #00529F;
}

.bg-green {
  background: #0C9A0C !important;
}

.bg-rose {
  background: #EB2260 !important;
}

.bg-orange {
  background: #e6a312 !important;
}

.bg-purple {
  background: #8a059c !important;
}

.bg-light-gray {
  background: #EBEBEB;
}

.bg-mid-gray {
  background: #DBDBDB;
}

.bg-dark-gray {
  background: #CBCBCB;
}

/***** accordion box style ******/
.accordion .card {
  border: 0;
  xborder-radius: 10px;
  border-top-left-radius: 10px !important;
  border-top-right-radius: 10px !important;
  border-bottom-left-radius: 10px !important;
  border-bottom-right-radius: 10px !important;
  xbox-shadow: 0px 48px 80px rgba(0, 0, 0, 0.07);
}

.accordion .card .card-header {
  margin-bottom: 0;
  border: 0;
  background: none;
  padding: 0;
}

.accordion .card .card-header h2 .btn {
  position: relative;
  display: flex;
  align-items: center;
  width: 100%;
  background: linear-gradient(90deg, #40C4FF 50.15%, #007EC2 201.39%);
  border-radius: 10px;
  border-bottom-left-radius: 0 !important;
  border-bottom-right-radius: 0 !important;
  padding: 13px 24px;
  color: #fff;
  font-size: 24px;
  font-weight: 600;
  text-decoration: none !important;
  outline: none !important;
  box-shadow: none !important;
  transition: color .15s ease-in-out, background-color .15s ease-in-out, border-color .15s ease-in-out, box-shadow .15s ease-in-out, border-radius .15s ease;
}

.accordion .card .card-header h2 .btn::after {
  flex-shrink: 0;
  width: 1.25rem;
  height: 1.25rem;
  margin-left: auto;
  color: #fff;
  content: "";
  background-image: url("../images/arrow-down.svg");
  background-repeat: no-repeat;
  background-position: center center;
  transition: all .3s ease-in-out;
}

.accordion .card .card-header h2 .btn:not(.collapsed) {
  border-radius: 10px 10px 0 0;
}

.accordion .card .card-header h2 .btn:not(.collapsed)::after {
  background-image: url("../images/arrow-down.svg");
  transform: rotate(180deg);
}

.accordion .card .card-body {
  xbackground: linear-gradient(360deg, #FFFFFF -168.75%, #F2F2F2 192.71%);
  background: #F2F2F2;
  border-radius: 0px 0px 10px 10px;
  font-size: 20px;
  font-weight: 600;
  padding: 24px;
}

.accordion .card .card-body .btn {
  width: 100%;
  max-width: 310px;
  font-weight: 500;
  height: 55px;
  font-size: 20px;
  border-radius: 6px;
}

/**** alerts box style ***/
.alert-danger {
  padding: 15px 10px;
  background: #FFC4C4;
  border: 1px solid #C20626;
  box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.15);
  border-radius: 8px;
  color: #FB0D0D;
  font-weight: 400;
  font-size: 14px;
  line-height: 18px;
}

.alert-success {
  padding: 15px 10px;
  background: #adf0be;
  border: 1px solid #048c27;
  box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.15);
  border-radius: 8px;
  color: #048c27;
  font-weight: 400;
  font-size: 14px;
  line-height: 18px;
}

/***** page head style *****/
.Sb-page-head {
  background: #007EC2;
  background-image: linear-gradient(to right bottom, #00529f, #005aa6, #0062ad, #006bb4, #0073ba, #047cc2, #0b86ca, #138fd2, #1f9cdd, #2aa9e9, #35b7f4, #40c4ff);
  color: #fff;
  padding: 12px 0;
  xxx_min-height: 250px;
  display: flex;
  align-items: center;
}

.Sb-page-head h1 {
  font-weight: 700;
  margin-bottom: 0;
}

.Sb-page-head .breadcrumb {
  background: transparent;
  padding: 0;
}

.Sb-page-head .breadcrumb .breadcrumb-item {
  font-size: 18px;
}

.Sb-page-head .breadcrumb .breadcrumb-item a {
  color: #40C4FF;
}

.Sb-page-head .breadcrumb .breadcrumb-item.active {
  color: #F2F2F2;
}

.Sb-page-head .breadcrumb .breadcrumb-item + .breadcrumb-item::before {
  content: "/";
  color: #40C4FF;
}

@media (min-width: 992px) {
  .Sb-page-head.small {
    min-height: 100px;
  }
  .Sb-page-head.small h1 {
    font-weight: 700;
    font-size: 30px;
    line-height: 25px;
    margin-bottom: 0;
  }
  .Sb-page-head.small .breadcrumb {
    background: transparent;
    padding: 0;
    margin-bottom: 10px;
  }
  .Sb-page-head.small .breadcrumb .breadcrumb-item {
    font-size: 14px;
  }
}

/*** positions style *****/
.relative {
  position: relative;
}

/**** calendar style ****/
.state {
  background: #F2F2F2;
  border: 0.5px solid #cacaca;
  height: 68px;
  position: relative;
  display: flex;
  flex-direction: column;
  align-content: center;
  justify-content: space-between;
  padding: 6px 4px;
}

.state:first-child {
  border-left: 1px solid #cacaca;
}

.state:last-child {
  border-right: 1px solid #cacaca;
}

@media (min-width: 992) {
  .state {
    padding: 6px 8px;
  }
}

.state span {
  width: 35px;
  height: 35px;
  border-radius: 50%;
  display: flex;
  align-items: flex-start;
  justify-content: center;
  margin: 0 auto;
}

.state small {
  font-weight: 700;
  font-size: 12px;
  line-height: 15px;
  color: #484A4B;
}

.state.avl_open {
  background: #d7edc0;
}

.state.avl_open small {
  color: #38ab0e;
}

.state.avl_locked {
  background: #d7edc0;
}

.state.avl_locked small {
  color: #484A4B;
}

.state.unv_open {
  background: #FEE7DE;
}

.state.unv_open small {
  color: #FB3010;
}

.state.unv_locked {
  background: #FEE7DE;
}

.state.unv_locked small {
  color: #484A4B;
}

.state.sick_locked {
  background: #c5e5fa;
}

.state.hol_locked {
  background: #c5e5fa;
}

.state.shift_open span {
  align-items: center;
  background: #007EC2;
  color: #fff;
}

.state.shift_open small {
  color: #007EC2;
}

.state.shift_locked span {
  align-items: center;
  background: #484A4B;
  color: #fff;
}

.state.shift_locked small {
  color: #484A4B;
}

.state.current_day::after {
  content: "";
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  border: 4px solid #40C4FF;
}

.state.passed-day {
  color: #AAAAAA;
}

.state.passed-day span {
  color: #AAAAAA;
}

.state.passed-day small {
  color: #AAAAAA;
}

/*** nice-button style ******/
.nice-button {
  width: 136px;
  height: 136px;
  border-radius: 50%;
  background: #fff;
  box-shadow: inset -5px 5px 0px rgba(64, 196, 255, 0.2);
  font-weight: 900;
  font-size: 15px;
  line-height: 19px;
}

.nice-button i {
  display: block;
  font-size: 30px;
  margin-bottom: 5px;
  text-shadow: -5px 5px 0px rgba(64, 196, 255, 0.2);
}

.nice-button.btn-outline-warning {
  border: 8px solid #F65715;
  color: #F65715;
}

.nice-button.btn-outline-success {
  border: 8px solid #77C206;
  color: #77C206;
}

.nice-button.btn-outline-success:hover {
  background: #77C206;
  box-shadow: none;
}

.nice-button.btn-outline-danger {
  border: 8px solid #C20626;
  color: #C20626;
}

.nice-button.btn-outline-danger:hover {
  background: #C20626;
  box-shadow: none;
}

.nice-button:hover {
  color: #fff;
}

/***** form styles *****/
form .input-with-icon {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  flex-direction: row-reverse;
  background: #FFFFFF;
  border: 0.5px solid #484A4B;
  box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.15);
  padding: 0px 18px;
  border-radius: 8px;
  transition: all 0.3s ease-in-out;
}

form .input-with-icon .form-control {
  border: 0;
  padding: 0;
  outline: none !important;
  box-shadow: none !important;
  height: 55px;
}

form .input-with-icon .input-icon {
  text-align: right;
  margin-right: 15px;
}

form .input-with-icon:focus-within {
  border-color: #F65715;
}

form .form-label {
  font-size: 16px;
  font-weight: 400;
}

form .form-label a {
  color: #007EC2;
}

form .custom-switch {
  padding-left: 84px;
}

form .custom-switch .custom-control-label::before {
  width: 60px;
  height: 28px;
  left: -84px;
  border-radius: 50px;
  background: linear-gradient(90deg, #E6E6E6 0%, #9E9D9D 100%);
  border: 0;
}

form .custom-switch .custom-control-label::after {
  background: #fff;
  width: 20px;
  height: 20px;
  left: calc(-84px + 4px);
  top: 8px;
  border-radius: 50%;
}

form .custom-switch .custom-control-input:checked ~ .custom-control-label::before {
  background: linear-gradient(90deg, #40C4FF 0%, #007EC2 100%);
}

form .custom-switch .custom-control-input:checked ~ .custom-control-label::after {
  transform: translateX(32px);
}

form .form-control.notes {
  background: #FFFFFF;
  /* Dark Grey */
  x_border: 0.5px solid #484A4B;
  /* Field Shadow */
  box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.15);
  border-radius: 10px;
  width: 100%;
  height: 225px;
  /*padding: 20px;*/
}

/**** tables style *****/
.table-responsive.bordered {
  border: 1px solid #40C4FF;
  border-radius: 10px;
}

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

.table tr td {
  font-weight: 700;
  font-size: 15px;
  line-height: 225%;
  color: #484A4B;
  padding-right: 14px;
  padding-left: 14px;
}

.table tr td.text-blue {
  color: #007EC2;
}

.table.table-striped tbody tr {
  background: #fff;
}

.table.table-striped tbody tr:nth-of-type(odd) {
  background: #E4F5FF;
}




.table.table-striped thead {
  background: #40C4FF;
}

.table.table-striped thead th {
  color: #fff;
  border-top: 0;
  border-bottom: 0;
}

.table.table-striped thead th:first-child {
  border-left: 0;
}

.table.table-striped thead th:last-child {
  border-right: 0;
}

.table.table-striped tfoot {
  background: #40C4FF;
}

.table.table-striped tfoot td {
  color: #fff;
  border-right-color: #fff;
}

.table.table-striped tfoot td:last-child {
  border-right: 0;
}

.table.table-bordered tr:last-child td {
  border-bottom: 0;
}

.table.table-bordered td {
  border: 0;
  border-bottom: 1px solid #40C4FF;
  border-right: 1px solid #40C4FF;
}

.table.table-bordered td:last-child {
  border-right: 0;
}

.table.table-bordered tfoot {
  background: #40C4FF;
  border-bottom: 0;
}

/**** navbar style ******/
.msg-num {
  background: #FB0707;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 17px;
  height: 17px;
  border-radius: 50%;
  position: absolute;
  top: -4px;
  right: 7px;
  font-weight: 700;
  font-size: 10px;
  line-height: 13px;
  color: #FBFBFB;
}

.msg-num.none {
  background: #CCCCCC;
}

.fa-envelope-open-text {
  font-size: 26px;
  color: #00529F;
}

.navbar {
  background: linear-gradient(270deg, #E6E6E6 -30.64%, #FFFFFF 106.54%);
  box-shadow: 0px 29px 24px rgba(0, 0, 0, 0.06), 0px 18.7963px 14.0556px rgba(0, 0, 0, 0.0455556), 0px 11.1704px 7.64444px rgba(0, 0, 0, 0.0364444), 0px 5.8px 3.9px rgba(0, 0, 0, 0.03), 0px 2.36296px 1.95556px rgba(0, 0, 0, 0.0235556), 0px 0.53704px 0.94444px rgba(0, 0, 0, 0.0144444);
  padding: 10px 0;
  transition: all 0.3s ease-in-out;
  z-index: 2;
}

.navbar .container-fluid {
  max-width: 1400px;
}

.navbar .header-options .navbar-toggler {
  padding: 0;
  border: 0;
  color: #00529F;
  margin-left: 38px;
}

.navbar .header-options .navbar-toggler i {
  font-size: 27px;
}

.navbar .header-options .msg-num {
  top: -11px;
  right: -4px;
}

.navbar .page-name {
  font-weight: 700;
  font-size: 20px;
  line-height: 25px;
  color: #00529F;
}

.navbar .navbar-brand {
  font-size: 14px;
  font-weight: 700;
  color: #F65715;
  padding: 0;
  margin: 0;
}

.navbar .navbar-brand img {
  width: 60px;
  height: 60px;
  border-radius: 50%;
}

.navbar .navbar-nav .nav-item .nav-link {
  font-weight: 600;
  font-size: 18px;
  color: #00529F;
  padding: 0 15px;
}

.navbar .navbar-nav .nav-item.active .nav-link {
  color: #F65715;
}

.navbar .navbar-nav .nav-item.profile-dropdown .dropdown-toggle {
  background: #FBFBFB;
  /* Field Shadow */
  box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.15);
  border-radius: 10px;
  padding: 12px;
  color: #B6B6B6;
}

.navbar .navbar-nav .nav-item.profile-dropdown .dropdown-toggle i {
  margin-right: 8px;
}

.navbar .navbar-nav.menu-options {
  align-items: center;
}

.navbar .navbar-nav.menu-options i {
  font-size: 23px;
}

.navbar .navbar-nav.menu-options .fa-envelope-open-text {
  font-size: 26px;
  color: #00529F;
}

.navbar .navbar-nav.menu-options .nav-item .nav-link {
  padding: 0 12px;
}

.navbar.fixed-top {
  transition: all 0.3s ease-in-out;
}

/*** small screens menu styles *****/
.small-menus {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-content: flex-start;
  align-items: flex-start;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: #fff;
  z-index: 9;
  transition: all 0.3s ease;
  transform: translateX(100%);
}

@media (min-width: 992px) {
  .small-menus {
    display: none;
  }
}

.small-menus.show {
  transform: translateX(0);
}

.small-menus .menu-head {
  background-color: #f8f9fa !important;
  padding: 20px 28px 20px 28px;
  background: linear-gradient(270deg, #E6E6E6 -30.64%, #FFFFFF 106.54%);
  box-shadow: 0px 29px 24px rgba(0, 0, 0, 0.06), 0px 18.7963px 14.0556px rgba(0, 0, 0, 0.0455556), 0px 11.1704px 7.64444px rgba(0, 0, 0, 0.0364444), 0px 5.8px 3.9px rgba(0, 0, 0, 0.03), 0px 2.36296px 1.95556px rgba(0, 0, 0, 0.0235556), 0px 0.53704px 0.94444px rgba(0, 0, 0, 0.0144444);
  background-image: url("../images/navbar.svg");
  background-repeat: no-repeat;
  background-position: right 0 top;
  background-size: 320px auto;
  width: 100%;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 99;
}

.small-menus .menu-head .page-name {
  font-weight: 700;
  font-size: 20px;
  line-height: 25px;
  color: #00529F;
}

.small-menus .menu-head i {
  color: #00529F;
  font-size: 26px;
}

.small-menus .menu-head .menu-brand img {
  max-height: 35px;
  width: auto;
  border-radius: 0;
}

.small-menus .menu-head .navbar-toggler {
  padding: 0;
  border: 0;
  margin-left: 38px;
}

.small-menus .menu-head .navbar-toggler i {
  font-size: 27px;
}

.small-menus .menu-head .msg-num {
  top: -9px;
  right: -1px;
}

.small-menus .menu-body {
  width: 100%;
  height: 100%;
  display: block;
  padding-left: 70px;
  overflow-y: auto;
}

.small-menus .menu-options {
  width: 70px;
  position: fixed;
  left: 0;
  top: 70px;
  background: #484A4B;
  height: calc(100vh - 70px);
  padding: 0;
  padding-bottom: 20px;
  margin: 0;
  list-style-type: none;
  list-style: none;
  align-items: center;
  justify-content: space-between;
  flex-direction: column;
  padding: 23px 10px;
  overflow-y: auto;
  text-align: center;
}

.small-menus .menu-options a {
  font-weight: 700;
  font-size: 10px;
  line-height: 13px;
  text-align: center;
  color: #FBFBFB;
}

.small-menus .menu-options a i {
  display: block;
  font-size: 26px;
}

.small-menus .menu-options .user-img {
  width: 48px;
  height: 48px;
  background: #FBFBFB;
  box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.15);
  border-radius: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 8px;
}

.small-menus .menu-options .bottom-menu a {
  display: block;
  padding-top: 13px;
  margin-top: 13px;
  width: 100%;
  border-top: 1px solid #40C4FF;
}

.small-menus .menu-links {
  width: 100%;
  padding: 0;
  margin: 0;
  padding: 0 10px;
  list-style: none;
  list-style-type: none;
  padding-top: 80px;
}

.small-menus .menu-links .nav-item {
  border-bottom: 0.5px solid #B6B6B6;
}

.small-menus .menu-links .nav-item .nav-link {
  padding: 25px 12px;
  font-weight: 400;
  font-size: 15px;
  line-height: 19px;
  color: #000000;
}

.small-menus .menu-links .nav-item .nav-link i {
  font-size: 23px;
  color: #40C4FF;
  margin-right: 14px;
  vertical-align: middle;
}

/*** home page style *****/
.Sb-home {
  min-height: calc(100vh - 215px);
  display: flex;
  align-items: center;
  justify-content: center;
}

.Sb-home .container {
  max-width: 500px;
}

.Sb-home a {
  font-weight: 500;
  font-size: 15px;
  line-height: 19px;
  color: #00529F;
  text-align: center;
  display: block;
  text-decoration: none !important;
  transition: all 0.3s ease-in-out;
}

.Sb-home a .link-icon {
  width: 70px;
  height: 70px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #00529F;
  box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.15);
  border-radius: 10px;
  margin: 0 auto 15px auto;
  transition: all 0.3s ease-in-out;
}

.Sb-home a .link-icon i {
  color: #fff;
  font-size: 30px;
}

@media (min-width: 992px) {
  .Sb-home a .link-icon {
    width: 100px;
    height: 100px;
  }
  .Sb-home a .link-icon i {
    font-size: 36px;
  }
}

@media (min-width: 992px) {
  .Sb-home a {
    font-weight: 600;
    font-size: 18px;
    line-height: 22px;
  }
}

.Sb-home a:hover {
  xxx_color: #F65715;
}

.Sb-home a:hover .link-icon {
  background: #F65715;
}

.Sb-home a .link-icon.disabled {
  background: #B6B6B6;
  cursor:default;
}

.Sb-home a:hover .disabled {
  color: #00ff00;
}

.link-alert {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 22px;
  height: 22px;
  border-radius: 50%;
  position: absolute;
  top: -6px;
  left: calc(50% + 20px);
  font-weight: 700;
  font-size: 12px;
  line-height: 12px;
  color: #FBFBFB;
}

@media (min-width: 992px) {
  .link-alert {
    width: 22px;
    height: 22px;
    top: -6px;
    left: calc(50% + 35px);
  }
}

.link-alert.la-red {
  
  background: #FB0707;
}

.link-alert.la-green {
  
  background: #7FC300;
  font-size: 10px;
}

.link-alert.la-amber {
  
  background: #F7B900;
  font-size: 10px;
}

.card-alert {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  margin-top:2px;
  margin-left:10px;
  font-weight: 700;
  font-size: 10px;
  line-height: 10px;
  background: #FB0707;
  color: #FBFBFB;
}

@media (min-width: 992px) {
  .card-alert {
    margin-top:4px;
  }
}

.menu-alert {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  margin-top:2px;
  margin-left:10px;
  font-weight: 700;
  font-size: 10px;
  line-height: 10px;
  background: #FB0707;
  color: #FBFBFB;
  float:right;
}

/*** profile page style *****/
@media (min-width: 992px) {
  .Sb-profile {
    padding-top: 40px;
  }
}

.Sb-profile .container {
  max-width: 760px;
}

/**** login page styles *****/
.Sb-login-header {
  background: #00529F url("../images/navbar.svg") no-repeat right top;
  padding: 36px 0;
  position: relative;
  z-index: 99;
  background-size: 100% auto;
}

@media (min-width: 992px) {
  .Sb-login-header {
    padding: 50px 0;
  }
}

.Sb-login {
  position: relative;
}

.Sb-login .container {
  max-width: 500px;
  padding-left: 32px;
  padding-right: 32px;
}

.Sb-login h2 {
  font-weight: 900;
  font-size: 25px;
  line-height: 31px;
  color: #00529F;
  margin-bottom: 10px;
}

.Sb-login .login-img {
  margin-top: -20px;
}

.Sb-login .accordion .card {
  box-shadow: rgba(0, 0, 0, 0.2) 0px 18px 50px -10px;
}

.Sb-login .accordion .card .card-header h2 .btn img {
  margin-right: 10px;
}

.Sb-login .accordion .card .card-header h2 .btn::after {
  display: none;
}

.Sb-login .btn {
  max-width: 100% !important;
}

.Sb-login .register-now {
  margin-top: 33px;
}

@media (min-width: 992px) {
  .Sb-login .register-now {
    margin-top: 50px;
  }
}

.Sb-login .register-now .btn {
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 500;
  height: 55px;
  font-size: 20px;
  border-radius: 6px;
}

.Sb-login .register-now .btn img {
  margin-right: 11px;
}

.Sb-login .register-now p {
  font-weight: 400;
  font-size: 15px;
  line-height: 19px;
  color: #484A4B;
}

.Sb-login .register-now p.small-text {
  font-size: 12px;
  line-height: 15px;
}

@media (min-width: 992px) {
  .Sb-login .register-now p {
    font-size: 18px;
    line-height: 22px;
  }
  .Sb-login .register-now p.small-text {
    font-size: 15px;
    line-height: 19px;
  }
}

.Sb-login .register-now p a {
  color: #00529F;
}

.Sb-login.register-page {
  position: relative;
  background: url(../images/login.svg) no-repeat center top -10px;
  padding-top: 80px;
}

.Sb-login.logout-page .accordion .card .card-body {
  background: #fff;
  padding: 38px 20px;
}

@media (min-width: 992px) {
  .Sb-login.logout-page .accordion .card .card-body {
    padding: 38px 28px;
  }
}

.Sb-login.logout-page .accordion .card .card-body .logout-details {
  padding: 36px 0 61px 0;
  font-weight: 400;
  font-size: 15px;
  line-height: 19px;
  padding-right: 20px;
}

@media (min-width: 992px) {
  .Sb-login.logout-page .accordion .card .card-body .logout-details {
    font-size: 20px;
    line-height: 26px;
  }
}

/**** notification page style *****/
.notification-block {
  font-size: 10px;
  font-weight: 500;
  line-height: 13px;
  color: #000000;
  align-items: center;
  border-bottom: 0.5px solid #B6B6B6;
  padding: 14px 8px;
  margin: 0;
}

.notification-block .sender-img {
  background: #195EAC;
  width: 38px;
  height: 38px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  font-weight: 400;
  font-size: 13px;
  line-height: 17px;
  color: #FFFFFF;
}

.notification-block .sender-img img {
  width: 38px;
  height: 38px;
  border-radius: 50%;
}

.notification-block .mail-title strong {
  display: block;
  margin-bottom: 4px;
}

.notification-block .mail-time {
  font-weight: 700;
}

@media (min-width: 992px) {
  .notification-block {
    font-size: 16px;
    font-weight: 500;
    line-height: 19px;
    padding: 20px 8px;
  }
  .notification-block .mail-day {
    font-size: 20px;
    line-height: 24px;
  }
}

.Sb-notification {
  padding-top: 10px;
}

@media (min-width: 992px) {
  .Sb-notification {
    padding-top: 30px;
  }
}

.Sb-notification .mail-day {
  font-weight: 400;
  font-size: 15px;
  line-height: 19px;
  color: #B6B6B6;
  border-bottom: 0.5px solid #B6B6B6;
  padding-bottom: 9px;
  padding-top: 9px;
}

.Sb-notification .container {
  max-width: 1000px;
}

.Sb-notification .notification-block {
  cursor: pointer;
}

.dot {
  height: 6px;
  width: 6px;
  margin-right:4px;
  border-radius: 50%;
  display: inline-block;
}
  
@media (min-width: 992px) {
  .dot {
    height: 10px;
    width: 10px;
  }
}

.dot-read {
  background-color: #DDDDDD;
}

.dot-unread {
  background-color: #FB0707;
}




.mail-overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 9;
  background: rgba(72, 74, 75, 0.3);
  transition: all 0.3s ease-in-out;
  opacity: 0;
  visibility: hidden;
}

.mail-overlay.show {
  opacity: 1;
  visibility: visible;
}

.mail-block {
  background: #fff;
  position: fixed;
  bottom: 0;
  left: 10px;
  width: calc(100% - 20px);
  height: 75%;
  z-index: 12;
  background: #FBFBFB;
  /* Large Drop Shadow */
  box-shadow: 0px 48px 80px rgba(0, 0, 0, 0.07), 0px 31.1111px 46.8519px rgba(0, 0, 0, 0.0531481), 0px 18.4889px 25.4815px rgba(0, 0, 0, 0.0425185), 0px 9.6px 13px rgba(0, 0, 0, 0.035), 0px 3.91111px 6.51852px rgba(0, 0, 0, 0.0274815), 0px 0.88889px 3.14815px rgba(0, 0, 0, 0.0168519);
  border-radius: 25px 25px 0px 0px;
  padding-top: 20px;
  padding-bottom: 20px;
  transition: all 0.3s ease-in-out;
  transform: translateY(100%);
}

.mail-block.show {
  transform: translateY(0);
}

.mail-block .notification-block {
  padding-right: 12px;
  padding-left: 12px;
}

.mail-block .notification-block .remove-mail {
  padding: 0;
  border: 0;
  box-shadow: none;
  margin: 0 auto;
  display: block;
  margin-top: 10px;
  font-size: 16px;
  color: #C20626;
}

@media (min-width: 992px) {
  .mail-block .notification-block .remove-mail {
    font-size: 20px;
  }
}

.mail-block .mail-content {
  font-size: 13px;
  padding: 20px;
  max-height: calc(100% - 50px);
  overflow-y: auto;
}

@media (min-width: 992px) {
  .mail-block .mail-content {
    font-size: 16px;
  }
}

@media (min-width: 1000px) {
  .mail-block {
    width: calc(70% - 20px);
    left: 15%;
  }
}

.mail-block .drag-box {
  width: 134px;
  height: 7px;
  background: #B6B6B6;
  border-radius: 100px;
  margin: 0 auto 20px auto;
  cursor: pointer;
}

/**** calendar page style ******/
.Sb-calendar {
  padding: 50px 0;
  min-height: calc(100vh - 240px);
  display: flex;
  align-items: center;
  position: relative;
}

.Sb-calendar .container {
  width: 100%;
  max-width: 900px;
}

.Sb-calendar .calendar-box {
  background: #fff;
  box-shadow: rgba(0, 0, 0, 0.16) 0px 10px 36px 0px, rgba(0, 0, 0, 0.06) 0px 0px 0px 1px;
  border-radius: 25px;
}

.Sb-calendar .calendar-box .bg-dark-blue {
  background: #007EC2;
  border-radius: 25px 0 0 25px;
}

.Sb-calendar .calendar-box .right-box {
  padding: 10px 20px;
}

@media (max-width: 767.98px) {
  .Sb-calendar .calendar-box .right-box {
    box-shadow: 0px 48px 80px rgba(0, 0, 0, 0.07), 0px 31.1111px 46.8519px rgba(0, 0, 0, 0.0531481), 0px 18.4889px 25.4815px rgba(0, 0, 0, 0.0425185), 0px 9.6px 13px rgba(0, 0, 0, 0.035), 0px 3.91111px 6.51852px rgba(0, 0, 0, 0.0274815), 0px 0.88889px 3.14815px rgba(0, 0, 0, 0.0168519);
    border-radius: 10px;
  }
}

.Sb-calendar .calendar-box .avalible-day {
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  padding: 20px;
}

.Sb-calendar .calendar-box .avalible-day h2 {
  text-transform: uppercase;
  font-weight: 300;
  color: rgba(255, 255, 255, 0.69);
}

.Sb-calendar .calendar-box .avalible-day h3 {
  font-size: 90px;
  font-weight: 800;
}

.Sb-calendar .calendar-box .calendar-head {
  background: linear-gradient(90deg, #40C4FF 50.15%, #007EC2 201.39%);
  border-radius: 10px 10px 0px 0px;
  font-weight: 700;
  font-size: 18px;
  line-height: 23px;
  color: #fff;
  text-align: center;
  padding: 16px 0;
}

.Sb-calendar .calendar-box .calendar-table {
  color: #000000;
  font-weight: 400;
  font-size: 16px;
  line-height: 20px;
  /**** timesheet page style ********/
}

.Sb-calendar .calendar-box .calendar-table .row {
  margin: 0;
}

.Sb-calendar .calendar-box .calendar-table .row .col {
  width: calc(100%/7);
}

.Sb-calendar .calendar-box .calendar-table .calendar-header {
  background: #EBEBEB;
}

.Sb-calendar .calendar-box .calendar-table .calendar-header .day-name {
  padding: 15px 10px;
}

.Sb-calendar .calendar-box .calendar-table .calendar-header .day-name.active-day {
  background: #00529F;
  color: #fff;
}

.Sb-calendar .calendar-box .calendar-table .carousel-body {
  background: #F2F2F2;
  padding: 36px 16px;
  /*min-height: 350px;*/
  height:350px;
  border-radius: 0 0 10px 10px;
  /**** journy page *****/
}

.Sb-calendar .calendar-box .calendar-table .carousel-body span,
.Sb-calendar .calendar-box .calendar-table .carousel-body label {
  font-weight: 400;
  font-size: 15px;
  line-height: 19px;
  color: #484A4B;
}

.Sb-calendar .calendar-box .calendar-table .carousel-body .form-labels {
  padding: 0;
}

.Sb-calendar .calendar-box .calendar-table .carousel-body .form-labels .col-form-label {
  padding: 0;
  text-align: left;
}

.Sb-calendar .calendar-box .calendar-table .carousel-body .form-labels .col-auto.col-form-label {
  width: 80px;
}

.Sb-calendar .calendar-box .calendar-table .carousel-body .form-labels .form-control {
  background: #FFFFFF;
  x_border: 0.5px solid #484A4B;
  box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.15);
  height: 42px;
}

.Sb-calendar .calendar-box .calendar-table .carousel-body .btn-white {
  background: #FFFFFF;
  /* Mid Grey */
  border: 1px solid #B6B6B6;
  border-radius: 5px;
  color: #40C4FF;
  width: 42px;
  height: 41px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 19px;
}

.Sb-calendar .calendar-box .calendar-table .carousel-body .add-block label {
  display: block;
  margin-bottom: 13px;
}

.Sb-calendar .calendar-box .calendar-table .carousel-body .add-block .btn-warning {
  font-weight: 800;
  font-size: 12px;
  line-height: 15px;
  height: 42px;
  display: flex;
  align-items: center;
  justify-content: center;
}

@media (min-width: 768px) {
  .Sb-calendar .calendar-box .calendar-table .carousel-body .add-block .btn-warning {
    font-size: 16px;
  }
}

.Sb-calendar .calendar-box .calendar-table .carousel-body .add-block .btn-warning i {
  margin-right: 6px;
  font-size: 20px;
  vertical-align: middle;
}

.Sb-calendar .calendar-box .calendar-table .carousel-body .expenses-details {
  max-height: 230px;
  overflow-y: auto;
}

.Sb-calendar .calendar-box .calendar-table .carousel-body .expenses-details .row {
  border-bottom: 1px solid #9E9D9D;
  padding: 5px 0;
  margin: 0 0;
  align-items: center;
}

.Sb-calendar .calendar-box .calendar-table .carousel-body .expenses-details .row:last-child {
  border: 0;
  padding-bottom: 0;
}

.Sb-calendar .calendar-box .calendar-table .carousel-body .expenses-details .map-icon {
  display: inline-block;
  margin-right: 10px;
}

.Sb-calendar .calendar-box .calendar-table .carousel-body .expenses-details .arrow {
  margin-left: 11px;
  margin-right: 15px;
  color: #007EC2;
}

.Sb-calendar .calendar-box .calendar-table .carousel-body .expenses-details .btn {
  font-size: 12px;
  border-radius: 13px;
  width: 31px;
  height: 31px;
  padding: 0;
  border-radius: 13px;
}

.Sb-calendar .calendar-box .calendar-table .carousel-body .expenses-details .btn-primary {
  background: #40C4FF;
  border-color: #40C4FF;
}


.btn {
  
  border-radius: 5px !important;
  
}

.btn-universal {
  
  background: #40C4FF !important;
  border-color: #40C4FF !important;
  color: #FFFFFF;
  
}

.btn-universal:hover {
  
  background: #2FB1EF !important;
  border-color: #2FB1EF !important;
  color: #FFFFFF !important;
  
}

.btn-disabled {
  
  background: #B6B6B6 !important;
  border-color: #B6B6B6 !important;
  color: #FFFFFF;
  
}

.btn-disabled:hover {
  
  background: #B6B6B6 !important;
  border-color: #B6B6B6 !important;
  color: #FFFFFF;
  
}

@media (min-width: 768px) {
  .Sb-calendar .calendar-box .calendar-table .carousel-body .expenses-details .btn {
    font-size: 16px;
    width: 38px;
    height: 38px;
  }
}

.Sb-calendar .calendar-box .calendar-table .form-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-top: 36px;
}

.Sb-calendar .calendar-box .calendar-table .form-footer span {
  display: block;
  width: 175px;
  x_padding: 9px;
  x_background: #E4F5FF;
  x_border: 0.5px solid #484A4B;
  box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.15);
  x_font-weight: 800;
  x_font-size: 20px;
  line-height: 25px;
  x_color: #00529F;
  
  border:1px solid #00529F; border-radius: 0.25rem; padding:5px; font-size:14px; font-weight:bold; color:#00529F; background-color:#FFFF;
}

.Sb-calendar .calendar-box .carousel .carousel-control-next,
.Sb-calendar .calendar-box .carousel .carousel-control-prev {
  height: 55px;
  top: 20px;
  font-size: 24px;
  color: #fff;
  opacity: 1;
}

.Sb-calendar .calendar-box .carousel .carousel-item {
  padding: 20px 10px;
}

.Sb-calendar .avalible-box {
  background: linear-gradient(360deg, #FFFFFF -168.75%, #F2F2F2 192.71%);
  background: #fff;
  border-radius: 10px;
  margin-top: 20px;
  padding: 20px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-weight: 400;
  font-size: 15px;
  line-height: 19px;
  color: #484A4B;
  box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;
}

.Sb-calendar .avalible-box .btn {
  background: #FBFBFB;
  /* Field Shadow */
  box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.15);
  font-weight: 700;
  font-size: 15px;
  line-height: 19px;
  color: #484A4B;
  text-shadow: 0px 5px 10px rgba(0, 0, 0, 0.15);
  width: 72.48px;
  height: 30.75px;
  border: 0;
  border-radius: 10px;
}

.Sb-calendar .avalible-box .btn:xxx_first-child {
  margin-right: -4px;
  border-radius: 10px 0 0 10px;
  border-radius: 10px;
}

.Sb-calendar .avalible-box .btn:xxx_last-child {
  margin-right: -4px;
  border-radius: 0 10px 10px 0;
  border-radius: 10px;
}

.Sb-calendar .avalible-box .btn.btn-toggled {
  background: #40C4FF;
  color: #fff;
}

@media (min-width: 992px) {
  .Sb-calendar .avalible-box {
    font-weight: 600;
    font-size: 20px;
  }
  .Sb-calendar .avalible-box .btn {
    font-size: 20px;
    width: 100.48px;
    height: 50.75px;
  }
}

/*** sort block style ****/
.table-sort {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 20px;
}

.table-sort .btn {
  width: 37px !important;
  height: 37px !important;
  border-radius: 50% !important;
  line-height: 1;
  display: flex;
  align-items: center;
  justify-content: center;
}

/***** stop watch style ******/
@media (min-width: 600px) {
  .Sb-stopWatch {
    padding-top: 50px;
  }
}

.Sb-stopWatch .container {
  padding: 0;
}

@media (min-width: 600px) {
  .Sb-stopWatch .container {
    padding-left: 16px;
    padding-right: 16px;
  }
}

.Sb-stopWatch .inner-container {
  background: #fff;
}

@media (min-width: 600px) {
  .Sb-stopWatch .inner-container {
    max-width: 390px;
    margin: 0 auto;
    box-shadow: rgba(0, 0, 0, 0.16) 0px 10px 36px 0px, rgba(0, 0, 0, 0.06) 0px 0px 0px 1px;
  }
}

.Sb-stopWatch .inner-container .clock-block {
  background: #E9F4FA;
  padding-top: 50px;
  padding-bottom: 50px;
}

.Sb-stopWatch .inner-container .clock-block .text-center {
  font-size: 40px;
  font-weight: 800;
  color: #007EC2;
  line-height: 1;
}

.Sb-stopWatch .inner-container .clock-block .text-center span {
  font-size: 20px;
  font-weight: 400;
  display: block;
}

.Sb-stopWatch .inner-container .clock-border {
  width: 300px;
  height: 300px;
  margin: 30px auto 0 auto;
  border-radius: 50%;
  background: #E9F4FA;
  box-shadow: inset -5px 5px 0px rgba(64, 196, 255, 0.2);
  border: 20px solid #36a3e0;
}

.Sb-stopWatch .inner-container .clock {
  position: relative;
  color: #007EC2;
}

.Sb-stopWatch .inner-container .clock .clock-face {
  display: block;
  position: absolute;
  top: 10px;
  left: 50%;
  margin-left: 2px;
  width: 3px;
  height: 13px;
  background: #d7e0e6;
  border-radius: 2px;
  z-index: 0;
  transform-origin: 50% 122px;
}

.Sb-stopWatch .inner-container .clock .clock-face.three, .Sb-stopWatch .inner-container .clock .clock-face.six, .Sb-stopWatch .inner-container .clock .clock-face.nine, .Sb-stopWatch .inner-container .clock .clock-face.twelve {
  background: #529bcd;
  width: 4px;
  height: 18px;
}

.Sb-stopWatch .inner-container .clock .clock-face.one {
  transform: rotate(30deg);
}

.Sb-stopWatch .inner-container .clock .clock-face.two {
  transform: rotate(60deg);
}

.Sb-stopWatch .inner-container .clock .clock-face.three {
  transform: rotate(90deg);
}

.Sb-stopWatch .inner-container .clock .clock-face.four {
  transform: rotate(120deg);
}

.Sb-stopWatch .inner-container .clock .clock-face.five {
  transform: rotate(150deg);
}

.Sb-stopWatch .inner-container .clock .clock-face.six {
  transform: rotate(180deg);
}

.Sb-stopWatch .inner-container .clock .clock-face.seven {
  transform: rotate(210deg);
}

.Sb-stopWatch .inner-container .clock .clock-face.eight {
  transform: rotate(240deg);
}

.Sb-stopWatch .inner-container .clock .clock-face.nine {
  transform: rotate(270deg);
}

.Sb-stopWatch .inner-container .clock .clock-face.ten {
  transform: rotate(300deg);
}

.Sb-stopWatch .inner-container .clock .clock-face.eleven {
  transform: rotate(330deg);
}

.Sb-stopWatch .inner-container .clock .clock-hand {
  display: block;
  position: absolute;
  top: 20px;
  left: 50%;
  margin-left: 1px;
  width: 6px;
  height: 115px;
  background-image: linear-gradient(to bottom, #529bcd, #7ab1d8, #9fc8e2, #c4deee, #e9f4fa);
  border-radius: 3px;
  z-index: 1;
  transform-origin: center 110px;
  transform: rotate(0);
  animation-name: secunda;
  animation-duration: 60s;
  animation-delay: 0;
  animation-timing-function: linear;
  animation-iteration-count: infinite;
  animation-play-state: paused;
}

.Sb-stopWatch .inner-container .clock .clock-hand.start {
  animation-play-state: running;
}

.Sb-stopWatch .inner-container .clock .clock-hand.stop {
  animation-play-state: paused;
}

.Sb-stopWatch .inner-container .clock .time-block {
  display: block;
  width: 100%;
  position: absolute;
  top: 100px;
  z-index: 2;
  left: 0;
  text-align: center;
  color: #007EC2;
  font-size: 40px;
  font-weight: 800;
  padding: 0 20px;
  margin-left: 4px;
}

.Sb-stopWatch .inner-container .clock .time-block span {
  display: inline-block;
  vertical-align: middle;
}

.Sb-stopWatch .inner-container .clock .time-block small {
  display: block;
  color: #717171;
  font-size: 12px;
  font-weight: 400;
}

.Sb-stopWatch .inner-container .stopwatch-options .option-block {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 28px 16px;
  font-weight: 700;
  font-size: 15px;
  line-height: 19px;
  color: #C20626;
}

.Sb-stopWatch .inner-container .stopwatch-options .option-block p {
  margin-bottom: 10px;
}

.Sb-stopWatch .inner-container .stopwatch-options .option-block p:last-child {
  margin-bottom: 0;
}

.Sb-stopWatch .inner-container .stopwatch-options .option-block p .icon {
  width: 26px;
  display: inline-block;
}

.Sb-stopWatch .inner-container .stopwatch-options .option-block p.disabled-text {
  color: #E6E6E6;
}

.Sb-stopWatch .inner-container .stopwatch-options .option-block.played {
  color: #77C206;
}

.Sb-stopWatch .inner-container .stopwatch-options .option-block.played p.disabled-text {
  color: #77C206;
}

/* ANIMATION */
@keyframes secunda {
  0% {
    transform: rotate(0);
  }
  100% {
    transform: rotate(360deg);
  }
}

.Sb-footer {
  background: #F2F2F2;
  padding: 24px 0;
  z-index: 1;
}

.Sb-footer ul {
  list-style: none;
  list-style-type: none;
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin: 0;
  padding: 0;
  border: 0;
}

.Sb-footer ul li {
  text-align: center;
}

.Sb-footer ul li a,
.Sb-footer ul li .nav-link {
  display: block;
  color: #484A4B;
  font-weight: 700;
  font-size: 14px;
  line-height: 13px;
  transition: all 0.3s ease-in-out;
  text-decoration: none !important;
}

.Sb-footer ul li a i,
.Sb-footer ul li .nav-link i {
  display: block;
  font-size: 30px;
  color: #00529F;
  margin-bottom: 8px;
  transition: all 0.3s ease-in-out;
}

.Sb-footer ul li a:hover,
.Sb-footer ul li .nav-link:hover {
  xxxcolor: #F65715;
}

.Sb-footer ul li a:hover i,
.Sb-footer ul li .nav-link:hover i {
  xxxcolor: #F65715;
}

@media (max-width: 575.98px) {
  .Sb-footer ul li a,
  .Sb-footer ul li .nav-link {
    font-size: 12px;
  }
  .Sb-footer ul li a i,
  .Sb-footer ul li .nav-link i {
    font-size: 18px;
  }
}

.Sb-footer ul li.active-page a i {
  xxxcolor: #F65715;
}

.Sb-footer ul li .nav-link {
  padding: 0;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

.Sb-footer ul li .nav-link.active i {
  color: #F65715;
}

.Sb-footer .terms a {
  font-weight: 700;
  font-size: 16px;
  line-height: 20px;
  color: #00529F;
}

@media (min-width: 992px) {
  .Sb-footer .terms a {
    font-size: 20px;
  }
}

/*** media query for screens *****/
/*** screen size 1250px ****/
@media (max-width: 1250px) {
  .navbar .navbar-nav .nav-item .nav-link {
    font-size: 16px;
    padding: 0 11px;
  }
}

/**** tablets 992px and smaller *****/
@media (max-width: 991.98px) {
  .container {
    width: 100%;
    max-width: 100%;
    padding: 0 30px;
  }
  .navbar {
    padding: 20px 0 20px 0;
    background-image: url("../images/navbar.svg");
    background-repeat: no-repeat;
    background-position: right 0 top;
    background-size: 320px auto;
  }
  .navbar .container-fluid {
    padding: 0 28px;
  }
  .navbar .navbar-collapse {
    display: none;
  }
  .navbar .navbar-brand img {
    max-height: 35px;
    width: auto;
    border-radius: 0;
  }
  .Sb-page-head {
    min-height: 0;
    background-image: none;
  }
  .Sb-page-head h1 {
    font-weight: 700;
    font-size: 20px;
    line-height: 25px;
  }
}

@media (max-width: 767.98px) {
  .Sb-calendar {
    padding: 10px 0;
  }
  .Sb-calendar .calendar-box {
    border-radius: 0;
    background: transparent;
    box-shadow: none;
  }
  .Sb-calendar .calendar-box .bg-dark-blue {
    display: none;
  }
  .Sb-calendar .calendar-box .right-box {
    border-radius: 0;
    background: transparent;
    box-shadow: none;
    padding: 0;
  }
  .Sb-calendar .calendar-box .carousel .carousel-item {
    padding: 20px 0px;
  }
  .Sb-calendar .avalible-box {
    margin-top: 10px;
  }
}

@media (max-width: 575.98px) {
  .main-content {
    background: #fff;
    border-radius: 0px 0px 30px 30px;
    padding-bottom: 30px;
  }
  .container {
    width: 100%;
    max-width: 100%;
    padding: 0 16px;
  }
  .accordion .card .card-header h2 .btn {
    font-weight: 700;
    font-size: 18px;
    line-height: 23px;
  }
  .accordion .card .card-body {
    font-weight: 400;
    font-size: 14px;
    line-height: 18px;
  }
  .accordion .card .card-body .btn {
    max-width: 100%;
    font-weight: 800;
    height: 43px;
    font-size: 14px;
  }
  form .input-with-icon .form-control {
    height: 48px;
  }
  form .form-label {
    font-size: 12px;
    line-height: 15px;
  }
  .Sb-footer ul li a {
    font-size: 10px;
  }
  .Sb-footer ul li a i {
    font-size: 24px;
    margin-bottom: 6px;
  }
  .Sb-calendar .calendar-box .carousel .carousel-item {
    padding: 0 0 20px 0px;
  }
  .Sb-calendar .calendar-box .carousel .carousel-control-next,
  .Sb-calendar .calendar-box .carousel .carousel-control-prev {
    top: 0;
  }
  .Sb-calendar {
    min-height: calc(100vh - 210px);
    align-items: flex-start;
    padding: 16px 0;
  }
  .Sb-calendar .avalible-box {
    margin-top: 0;
  }
  .Sb-page-head h1.long-title {
    font-size: 15px;
  }
}

@media (max-width: 340px) {
  .Sb-calendar .calendar-box .calendar-table,
  .Sb-calendar .avalible-box {
    zoom: 0.8;
  }
}

@media (max-width: 320px) {
  .Sb-login .container {
    padding-left: 24px;
    padding-right: 24px;
  }
}
/*# sourceMappingURL=style.css.map */

/* PROFILE - SWITCH */

.switch {
  position: relative;
  display: inline-block;
  width: 60px;
  height: 28px;
  margin-top:4px;
  margin-bottom:0px;
}

.switch input { 
  opacity: 0;
  width: 0;
  height: 0;
}

.slider {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: linear-gradient(90deg, #E6E6E6 0%, #9E9D9D 100%);
  -webkit-transition: .2s;
  transition: .2s;
}

.slider:before {
  position: absolute;
  content: "";
  height: 20px;
  width: 20px;
  left: 4px;
  bottom: 4px;
  background-color: white;
  -webkit-transition: .2s;
  transition: .2s;
}

input:checked + .slider {
  background: linear-gradient(90deg, #40C4FF 0%, #007EC2 100%);
}

input:focus + .slider {
  box-shadow: 0 0 1px #2196F3;
}

input:checked + .slider:before {
  -webkit-transform: translateX(32px);
  -ms-transform: translateX(32px);
  transform: translateX(32px);
}

.slider.round {
  border-radius: 34px;
}

.slider.round:before {
  border-radius: 50%;
}