.bodyface{
  background-color:white;
}
  :root{
  --clr-accent-400: hsl(224, 100%, 50%);
}


.bd-placeholder-img {
    font-size: 1.125rem;
    text-anchor: middle;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
  }
  .cardhover {
    border: 4px solid white; /* might stick! */
  }

.cardhover:hover {
  border: 4px solid rgb(48, 87, 227); /* might stick! */
  border-radius: 10px;
  /* transform:scale(1.02); */
  transition: 0.3s ease-in-out;

}

.btn-group {
  display: flex;
  justify-content: center;
  width: 100%;
  gap: 5px;

}
.btn-group button{
  width: 100% !important;
}

.card-body{
  width: 100%;
  padding: 5px !important;
}
.card-text{
  position: absolute;
  top: 20px;
  right: 20px;
}
.card-title{
  display: inline-block;
  position: relative;
  bottom: 30px;
  left: 10px;
  /* content: "";
  position: relative;
  height: 3px;
  transition: all 1s;
  width: max-content;
  bottom: 78px;
  left: 272px; */
}
.card-title::after{
  content: '';
  position: absolute;
  width: 100%;
  transform: scaleX(0);
  height: 4px;
  border-top-right-radius: 10px;
  bottom: 0;
  left: 0;
  background-color: #0d6efd;
  transform-origin: bottom right;
  transition: transform 0.25s ease-out;
  /* content: "";
  position: absolute;
  height: 10px;
  right: calc(var(--padding) * -100);
  bottom: 0;
  width: 100%;
  /* width: calc(100% + var(--padding)); */
  /* background:var(--clr-accent-400); */
}

.card-title:hover:after {
  transform: scaleX(1);
  transform-origin: bottom left;
}

 body {
     background-color: #f9f9fa
 }

 .flex {
     -webkit-box-flex: 1;
     -ms-flex: 1 1 auto;
     flex: 1 1 auto
 }

 @media (max-width:991.98px) {
     .padding {
         padding: 1.5rem
     }
 }

 @media (max-width:767.98px) {
     .padding {
         padding: 1rem
     }
 }

 .padding {
     padding: 5rem
 }

 .card {
     box-shadow: none;
     -webkit-box-shadow: none;
     -moz-box-shadow: none;
     -ms-box-shadow: none
 }

 .pl-3,
 .px-3 {
     padding-left: 1rem !important
 }

 .card {
     position: relative;
     display: flex;
     flex-direction: column;
     min-width: 0;
     word-wrap: break-word;
     background-color: #fff;
     background-clip: border-box;
     border-radius: 0
 }

 .card .card-title {
     color: #000000;
     margin-bottom: 0.625rem;
     font-size: 2.875rem;
     font-weight: 500
 }

 .card .card-description {
     margin-bottom: .875rem;
     font-weight: 400;
     color: #76838f
 }

 p {
     font-size: 0.875rem;
     margin-bottom: .5rem;
     line-height: 1.5rem
 }

 .table-responsive {
     display: block;
     width: 100%;
     overflow-x: auto;
     -webkit-overflow-scrolling: touch;
     -ms-overflow-style: -ms-autohiding-scrollbar
 }

 .table,
 .jsgrid .jsgrid-table {
     width: 100%;
     max-width: 100%;
     margin-bottom: 1rem;
     background-color: transparent
 }

 .table thead th,
 .jsgrid .jsgrid-table thead th {
     border-top: 0;
     border-bottom-width: 1px;
     font-weight: 500;
     font-size: .9rem!important;
     text-transform: uppercase
 }

 .table td,
 .jsgrid .jsgrid-table td {
     font-size: 0.875rem;
     padding: .475rem 0.4375rem;
 }


 .mt-10{
         padding: 0.875rem 0.3375rem !important;
 }

 button{
     outline: 0 !important;
 }

 .form-control:focus {

        box-shadow: 0 0 0 0rem rgba(0,123,255,.25) !important;

 }

 table:not(#faqs) th{
  font-size: 20px;

 }


  .table-responsive{}
  @media (min-width: 768px) {
    .bd-placeholder-img-lg {
      font-size: 3.5rem;
    }

  }
  @media (min-width: 576px){
.row-cols-sm-2>* {
    flex: 0 0 auto;
    width: 50%;
}
  }
  @media (max-width: 767px){
    .row-cols-sm-2>* {
        flex: 0 0 auto;
        width: 100%;
    }
      }

      body {
        background-color: #f9f9fa
    }

    .flex {
        -webkit-box-flex: 1;
        -ms-flex: 1 1 auto;
        flex: 1 1 auto
    }


    @media (max-width:991.98px) {
        .padding {
            padding: 1.5rem
        }
    }

    @media (max-width:767.98px) {
        .padding {
            padding: 1rem
        }
    }
    .deleteOM{
      display: flex;
      align-items: center;
      gap: 3px;
   }
   .content-right{
    background-color: #efefef;
   }

   .header-container{
    padding-left: 19px;
    font-weight: 700;
    font-family: muli, sans-serif;
   }

   .btn-OM{
    display: flex;
    gap: 5px;
   }

   .btn-OM a{
    width: 100%;
   }


@media (max-width:576px) {
    .sidebar {
        height: 100vh;
    }
    #collapseSidebar {
        display: none;
    }

   #collapseSidebarMobile {
       display: block;
   }


}

@media (min-width: 600px) and (max-width: 1350px) {
    .sidebar {
        width: 220px;
    }
}




#collapseSidebar{
    position: absolute;
    height: 15%;
    right: -25px;
    top: 40%;
    visibility: visible;
    border-radius: 5px;
    background-color: #9e2339;
    color: white;
    border-radius: 0px 11px 11px 0px;
}

#collapseSidebarMobile{
    display: none;
    margin: auto;
    border-radius: 0px 0px 11px 11px;
    width: 30%;
    background-color: #9e2339;
    color: white;
}

.isHidden {
    display: none;
}

.invisibleSidebar {
    width: 0;
    visibility: hidden;
    padding: 0 !important;
}

.invisibleSidebarMobile {
    height: 0;
    visibility: hidden;
    padding: 0 !important;
}

.noWidth{
    width: 0;
}

.noHeight{
    height: 0;
}

.center-fifty {
    margin: auto;
    width: 80%;
}
.pilot-icons {
    width: 25px !important;
    height: 25px;
}