/*!
* Kept Companies
* (https://www.keptcompanies.com)
*/
:root {
  /* globals */
  --primaryFont: 'Montserrat', Arial, sans-serif;
  --globalPaddingHalf: 15px;
  --globalPadding: 30px;
  --globalPaddingDouble: 60px;

  /* card */
  --cardMaxWidth: 576px;

  /* theme colors */
  --blueColor: #0075AB;
  --blueColorRGB: 0,117,171;
  --blueColorHover: #005983;
  --blueColorHoverRGB: 0,89,131;

  --greenColor: #00C360;
  --greenColorRGB: 0,195,96;
  --greenColorHover: #00963E;
  --greenColorHoverRGB: 0,150,62;

  --tanColor: #C5BA9C;
  --tanColorRGB: 197,186,156;
  --darkTanColor: #9C9175;
  --darkTanColorRGB: 156,145,117;
  --lightTanColor: #EBE9E3;
  --lightTanColorRGB: 235,233,227;

  --grayColor: #737373;
  --grayColorRGB: 115,115,115;
  --grayColorHover: #333333;
  --grayColorHoverRGB: 51,51,51;

  /* form colors */
  --infoColor: #F1C619;
  --infoColorRGB: 241,198,25;
  --infoColorHover: #6C5600;
  --infoColorHoverRGB: 108,86,0;

  --dangerColor: #F8D7DA;
  --dangerColorRGB: 248,215,218;
  --dangerColorHover: #BC2C39;
  --dangerColorHoverRGB: 88,21,28;
}
body,
html {
  height: 100%;
}
body {
  font-family: var(--primaryFont);
  background: radial-gradient(rgba(0,198,83,1),rgba(0,0,0,1));
}
body .overlay {
  background: linear-gradient(145deg,rgba(0,198,83,0.65),rgba(0,117,171,0.65) 80%);
  width: 100%;
  height: 100%;
}
/* blue */
body.blue {
  background: radial-gradient(rgba(var(--blueColorRGB),1),rgba(0,0,0,1));
}
body.blue .overlay {
  background: linear-gradient(145deg,rgba(var(--blueColorRGB),0.65),rgba(var(--blueColorHoverRGB),0.65) 80%);
}
body.blue .btn-primary {
  background-color: var(--blueColor);
  color: #ffffff;
}
body.blue .btn-primary:hover,
body.blue .btn-primary:focus,
body.blue .btn-primary:active {
  background-color: var(--blueColorHover) !important;
}
body.blue .btn-secondary {
  background-color: var(--greenColorHover);
}
body.blue .btn-secondary:hover,
body.blue .btn-secondary:focus,
body.blue .btn-secondary:active {
  background-color: var(--greenColor) !important;
}
body.blue .modal .modal-header {
  background-color: var(--blueColor);
  background: linear-gradient(to left,var(--blueColor),var(--blueColorHover));
}
/* dark */
body.dark {
  background: radial-gradient(rgba(var(--grayColorRGB),1),rgba(0,0,0,1));
}
body.dark .overlay {
  background: linear-gradient(145deg,rgba(var(--grayColorRGB),0.65),rgba(var(--grayColorRGB),0.65) 80%);
}
body.dark .btn-primary {
  background-color: var(--grayColor);
}
body.dark .btn-primary:hover,
body.dark .btn-primary:focus,
body.dark .btn-primary:active {
  background-color: var(--grayColorHover) !important;
}
body.dark .btn-secondary {
  background-color: var(--grayColorHover);
}
body.dark .btn-secondary:hover,
body.dark .btn-secondary:focus,
body.dark .btn-secondary:active {
  background-color: #000000 !important;
}
body.dark .card .content .item a,
body.dark .card .details h1 {
  color: var(--grayColorHover);
}
body.dark .card .content .item i {
  color: var(--grayColorHover) !important;
}
body.dark .modal .modal-header {
  background-color: var(--grayColor);
  background: linear-gradient(to left,var(--grayColor),var(--grayColorHover));
}
/* green */
body.green {
  background: radial-gradient(rgba(var(--greenColorRGB),1),rgba(0,0,0,1));
}
body.green .overlay {
  background: linear-gradient(145deg,rgba(var(--greenColorRGB),0.65),rgba(var(--greenColorRGB),0.65) 80%);
}
body.green .card .content .item a,
body.green .card .details h1 {
  color: var(--greenColorHover);
}
body.green .card .content .item i {
  color: var(--blueColorHover) !important;
}
body.green .modal .modal-header {
  background-color: var(--greenColor);
  background: linear-gradient(to left,var(--greenColor),var(--greenColorHover));
}
/* tan */
body.tan {
  background: radial-gradient(rgba(var(--tanColorRGB),1),rgba(0,0,0,1));
}
body.tan .overlay {
  background: linear-gradient(145deg,rgba(var(--tanColorRGB),0.65),rgba(var(--tanColorRGB),0.65) 80%);
}
body.tan .btn-primary {
  background-color: var(--darkTanColor);
}
body.tan .btn-primary:hover,
body.tan .btn-primary:focus,
body.tan .btn-primary:active {
  background-color: var(--darkTanColor) !important;
}
body.tan .btn-secondary {
  background-color: var(--blueColorHover);
}
body.tan .btn-secondary:hover,
body.tan .btn-secondary:focus,
body.tan .btn-secondary:active {
  background-color: var(--blueColorHover) !important;
}
body.tan .card .details h1 {
  color: var(--darkTanColor);
}
body.tan .card .content .item a {
  color: var(--grayColorHover);
}
body.tan .card .content .item i {
  color: var(--blueColorHover) !important;
}
body.tan .modal .modal-header {
  background-color: var(--tanColor);
  background: linear-gradient(to left,var(--tanColor),var(--darkTanColor));
}
body.qr {
  background: #ffffff;
  background: radial-gradient(rgba(255,255,255,1),rgba(0,0,0,.15));

}
/* pwa */
.pwa-install-popup {
  display: none;
  padding: 15px;
  position: fixed;
  z-index: 9999;
  left: 0;
  top: 0;
  width: 100vw;
  height: 100vh;
  background: rgba(0,0,0,0.5);
}
.pwa-install-popup .pwa-popup-content {
  background: #ffffff;
  padding: 20px;
  max-width: 400px;
  width: 90vw;
  position: fixed;
  left: 50%;
  bottom: 24px;
  transform: translateX(-50%);
  border-radius: 8px;
  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.15);
}
.pwa-install-popup .pwa-popup-content .close-pwa-popup {
  position: absolute;
  top: 8px;
  right: 12px;
  background: none;
  border: none;
  font-size: 20px;
}
/* font */
.text-gradient {
  background: linear-gradient(45deg,rgba(var(--greenColorRGB),1),rgba(var(--blueColorRGB),1));
  background-clip: text;
  -webkit-background-clip: text;
  color: transparent;
  -webkit-text-fill-color: transparent;
}
/* cards */
.card {
  border: 0;
  width: 100%;
  max-width: var(--cardMaxWidth);
  box-shadow: rgba(0, 0, 0, 0.25) 0px 14px 28px, rgba(0, 0, 0, 0.22) 0px 10px 10px;
}
.card .details {
  padding: var(--globalPaddingHalf) var(--globalPadding);
}
.card .details h1 {
  font-size: 1.25em;
  font-weight: 700;
  margin-bottom: 0;
  color: var(--blueColor);
}
.card .details h2 {
  font-size: 1em;
}
.card .details .logo {
  max-width: 175px;
  max-height: 50px;
  margin-top: -10px !important;
}
.card .content {
  padding-bottom: var(--globalPaddingHalf);
}
.card .content a {
  color: var(--blueColor);
  font-size: 14px;
}
.card .content p {
  font-size: 14px;
}
.card .content .item {
  padding: 10px var(--globalPadding);
  font-size: 14px;
}
.card .content .item i {
  width: 30px;
  height: 30px;
  font-size: 21px;
  color: var(--greenColorHover);
  display: flex;
  align-items: center;
  justify-content: center;
}
.card .content .item svg {
  color: var(--greenColor);
}
.card .header {
  padding: var(--globalPaddingDouble) var(--globalPadding);
  border-radius: 5px 5px 0 0;
  text-align: center;
  height: 175px;
}
.card .profile {
  margin-top: -62.5px;
  padding: 0 var(--globalPadding);
}
.card .profile.portrait-none {
  margin-top: -20px;
  margin-bottom: 20px;
}
.card .profile.portrait-none .actions {
  text-align: center !important;
  width: 100%;
}
.card .profile.portrait-none .portrait {
  display: none;
}
.card .profile .portrait img {
  width: 125px;
  height: 125px;
  border-radius: 50%;
  background-color: #ffffff;
  background: radial-gradient(#dddddd,#eeeeee);
}
.card .content h4 {
  font-size: 13px;
  margin-bottom: 0;
  color: #555555;
}
.btn-secondary,
.btn-primary {
  background: var(--greenColor);
  color: #ffffff !important;
  font-size: 14px;
  font-weight: 700;
  padding: 10px 20px;
  border: 0;
}
.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active {
  background: var(--greenColorHover) !important;
  color: #ffffff !important;
}
.btn-secondary {
  background: var(--blueColor);
  color: #ffffff !important;
}
.btn-secondary:hover,
.btn-secondary:focus,
.btn-secondary:active {
  background: var(--blueColorHover) !important;
  color: #ffffff !important;
}
.card .header.bg-1 {
  background: linear-gradient(145deg,rgba(0,0,0,0.25),rgba(0,0,0,0.35) 80%),url('../images/bg/1.jpg') center center no-repeat;
  background-size: cover;
}
.card .header.bg-2 {
  background: linear-gradient(145deg,rgba(0,0,0,0.25),rgba(0,0,0,0.35) 80%),url('../images/bg/2.jpg') center center no-repeat;
  background-size: cover;
}
.card .header.bg-3 {
  background: linear-gradient(145deg,rgba(0,0,0,0.25),rgba(0,0,0,0.35) 80%),url('../images/bg/3.jpg') center center no-repeat;
  background-size: cover;
}
.card .header.bg-4 {
  background: linear-gradient(145deg,rgba(0,0,0,0.25),rgba(0,0,0,0.35) 80%),url('../images/bg/4.jpg') center center no-repeat;
  background-size: cover;
}
.card .header.bg-5 {
  background: linear-gradient(145deg,rgba(0,0,0,0.25),rgba(0,0,0,0.35) 80%),url('../images/bg/5.jpg') center center no-repeat;
  background-size: cover;
}
.card .header.bg-6 {
  background: linear-gradient(145deg,rgba(0,0,0,0.25),rgba(0,0,0,0.35) 80%),url('../images/bg/6.jpg') center center no-repeat;
  background-size: cover;
}
.card .header.bg-7 {
  background: linear-gradient(145deg,rgba(0,0,0,0.25),rgba(0,0,0,0.35) 80%),url('../images/bg/7.jpg') center center no-repeat;
  background-size: cover;
}
.card .header.bg-8 {
  background: linear-gradient(145deg,rgba(0,0,0,0.25),rgba(0,0,0,0.35) 80%),url('../images/bg/8.jpg') center center no-repeat;
  background-size: cover;
}
.card .header.bg-9 {
  background: linear-gradient(145deg,rgba(0,0,0,0.25),rgba(0,0,0,0.35) 80%),url('../images/bg/9.jpg') center center no-repeat;
  background-size: cover;
}
.card .header.bg-10 {
  background: linear-gradient(145deg,rgba(0,0,0,0.25),rgba(0,0,0,0.35) 80%),url('../images/bg/10.jpg') center center no-repeat;
  background-size: cover;
}
.card .header.bg-11 {
  background: linear-gradient(145deg,rgba(0,0,0,0.25),rgba(0,0,0,0.35) 80%),url('../images/bg/11.jpg') center center no-repeat;
  background-size: cover;
}
.card .header.bg-12 {
  background: linear-gradient(145deg,rgba(0,0,0,0.25),rgba(0,0,0,0.35) 80%),url('../images/bg/12.jpg') center center no-repeat;
  background-size: cover;
}
.card .header.bg-13 {
  background: linear-gradient(145deg,rgba(0,0,0,0.25),rgba(0,0,0,0.35) 80%),url('../images/bg/13.jpg') center center no-repeat;
  background-size: cover;
}
.card .header.bg-14 {
  background: linear-gradient(145deg,rgba(0,0,0,0.25),rgba(0,0,0,0.35) 80%),url('../images/bg/14.jpg') center center no-repeat;
  background-size: cover;
}
.card .header.bg-15 {
  background: linear-gradient(145deg,rgba(0,0,0,0.25),rgba(0,0,0,0.35) 80%),url('../images/bg/15.jpg') center center no-repeat;
  background-size: cover;
}
.card .header.bg-16 {
  background: linear-gradient(145deg,rgba(0,0,0,0.25),rgba(0,0,0,0.35) 80%),url('../images/bg/16.jpg') center center no-repeat;
  background-size: cover;
}
.card .header.bg-17 {
  background: linear-gradient(145deg,rgba(0,0,0,0.25),rgba(0,0,0,0.35) 80%),url('../images/bg/17.jpg') center center no-repeat;
  background-size: cover;
}
.card .header.bg-18 {
  background: linear-gradient(145deg,rgba(0,0,0,0.25),rgba(0,0,0,0.35) 80%),url('../images/bg/18.jpg') center center no-repeat;
  background-size: cover;
}
.card .header.bg-19 {
  background: linear-gradient(145deg,rgba(0,0,0,0.25),rgba(0,0,0,0.35) 80%),url('../images/bg/19.jpg') center center no-repeat;
  background-size: cover;
}
.card .header.bg-20 {
  background: linear-gradient(145deg,rgba(0,0,0,0.25),rgba(0,0,0,0.35) 80%),url('../images/bg/20.jpg') center center no-repeat;
  background-size: cover;
}
.card .header.bg-21 {
  background: linear-gradient(145deg,rgba(0,0,0,0.25),rgba(0,0,0,0.35) 80%),url('../images/bg/21.jpg') center center no-repeat;
  background-size: cover;
}
.card .header.bg-22 {
  background: linear-gradient(145deg,rgba(0,0,0,0.25),rgba(0,0,0,0.35) 80%),url('../images/bg/22.jpg') center center no-repeat;
  background-size: cover;
}
.card .header.bg-23 {
  background: linear-gradient(145deg,rgba(0,0,0,0.25),rgba(0,0,0,0.35) 80%),url('../images/bg/23.jpg') center center no-repeat;
  background-size: cover;
}
.card .header.bg-24 {
  background: linear-gradient(145deg,rgba(0,0,0,0.25),rgba(0,0,0,0.35) 80%),url('../images/bg/24.jpg') center center no-repeat;
  background-size: cover;
}
.card .header.bg-25 {
  background: linear-gradient(145deg,rgba(0,0,0,0.25),rgba(0,0,0,0.35) 80%),url('../images/bg/25.jpg') center center no-repeat;
  background-size: cover;
}
.card .header.bg-26 {
  background: linear-gradient(145deg,rgba(0,0,0,0.25),rgba(0,0,0,0.35) 80%),url('../images/bg/26.jpg') center center no-repeat;
  background-size: cover;
}
.card .header.bg-27 {
  background: linear-gradient(145deg,rgba(0,0,0,0.25),rgba(0,0,0,0.35) 80%),url('../images/bg/27.jpg') center center no-repeat;
  background-size: cover;
}
.card .header.bg-28 {
  background: linear-gradient(145deg,rgba(0,0,0,0.25),rgba(0,0,0,0.35) 80%),url('../images/bg/28.jpg') center center no-repeat;
  background-size: cover;
}
.card .header.bg-29 {
  background: linear-gradient(145deg,rgba(0,0,0,0.25),rgba(0,0,0,0.35) 80%),url('../images/bg/29.jpg') center center no-repeat;
  background-size: cover;
}
.card .header.bg-30 {
  background: linear-gradient(145deg,rgba(0,0,0,0.25),rgba(0,0,0,0.35) 80%),url('../images/bg/30.jpg') center center no-repeat;
  background-size: cover;
}
.card .header.bg-31 {
  background: linear-gradient(145deg,rgba(0,0,0,0.25),rgba(0,0,0,0.35) 80%),url('../images/bg/31.jpg') center center no-repeat;
  background-size: cover;
}
.card .header.bg-32 {
  background: linear-gradient(145deg,rgba(0,0,0,0.25),rgba(0,0,0,0.35) 80%),url('../images/bg/32.jpg') center center no-repeat;
  background-size: cover;
}
/* modal */
.modal {
  font-size: 14px;
}
.modal .modal-content {
  border: 0;
  box-shadow: rgba(0, 0, 0, 0.3) 0px 19px 38px, rgba(0, 0, 0, 0.22) 0px 15px 12px;
}
.modal .modal-info {
  padding: var(--globalPaddingHalf);
  font-size: 13px;
  background-color: rgba(var(--infoColorRGB),0.2);
  color: var(infoColorHover);
  border-bottom: 1px solid rgba(var(--infoColorHoverRGB),0.2);
}
.modal .modal-info i {
  font-size: 21px;
  color: var(--infoColorHover);
}
.modal .modal-body .alert i {
  font-size: 21px;
}
.modal .modal-info p {
  margin-bottom: 0;
  color: var(--infoColorHover);
}
.modal .modal-body .alert p {
  margin-bottom: 0;
}
.modal .modal-body .alert {
  padding: 10px;
  font-size: 13px;
}
.modal .modal-header {
  background-color: var(--greenColor);
  background: linear-gradient(to left,var(--greenColor),var(--blueColorHover));
  color: #ffffff;
}
.modal .modal-header h5 {
  font-size: 16px;
  font-weight: 700;
}
.modal .modal-body label {
  font-size: 13px;
  font-weight: 700;
  margin-bottom: 5px;
  color: var(--blueColorHover);
}
.modal .modal-body .is-invalid label {
  color: var(--dangerColorHover);
}
.modal .modal-body .form-select,
.modal .modal-body .form-control {
  font-size: 14px;
  background-color: #f9f9f9;
}
.modal .modal-footer button {
  margin: 0 auto;
  display: block;
  min-width: 150px;
}
@media(max-width:575px){
  body,
  body .overlay {
    background: #ffffff !important;
  }
  .btn-secondary,
  .btn-primary {
    padding: 10px 15px;
  }
  .overlay .d-flex {
    justify-content: start !important;
  }
  .card {
    box-shadow: none;
    border-radius: 0;
    min-width: 359px;
  }
  .card .header {
    border-radius: 0;
    height: auto;
  }
  .card .details .logo {
    margin-top: 15px !important;
    margin-bottom: 10px;
    max-width: 175px;
    max-height: 50px;
  }
  .card .profile.portrait-none {
    margin-bottom: var(--globalPadding);
  }
  .card .profile .actions {
    display: none;
  }
  .card .portrait {
    width: 100%;
  }
  .card .download {
    display: none;
  }
}