/*------------------------------------------------------------------
    File Name: custom.css
-------------------------------------------------------------------*/

/** ADD YOUR AWESOME CODES HERE **/

.topbar .navbar {
  border-bottom: 1px solid #8080803d;
  padding: 0;
  background: #060b10;
  /* border: none; */
  border-radius: 0;
}

div#content {
  background: #060b10;
}

.content-section{
  margin-top: 25px;
  margin-bottom: 4%;
  background-color: black;
  line-height: normal;
  font-weight: 300;
  color: #060b10;
  padding: 25px 15px;
  background: #ffffff17;
  box-shadow: 0 5px 20px rgba(0, 0, 0, 0.05);
  border-radius: 5px;
  width: 100%;
}

.navbar-logo{
  height: 42px !IMPORTANT;
  width:110px;
}

.navbar-logo-full{
  height: 50px;
  width: 136px;
  display: block;
  margin-left: auto;
  margin-right: auto;
}

.icon_info ul.user_profile_dd>li{
  background: #060b10 !IMPORTANT;

}

.sidebar_toggle {
  background: #060b10 !IMPORTANT;
}

a#navbarDropdown {
  color: #5b7793;
  padding: 22px 26px 14px;
  font-size: 15px;
  cursor: pointer;
}


#sidebar {
  background-color: #060b10;
  color: white !IMPORTANT;
  border-right: 1px solid #ffffff24;
}

.sidebar_user_info {
  background-color: #000000;
}

#sidebar ul li a {
  color: #ffffff;
}

.logo_icon{
  background-color: #000000;
}

#sidebar ul.components ul {
  background: #1d2126;
  color: white !IMPORTANT;
}

#sidebar ul.components li ul li a {
  color: white;
}

#sidebar ul li a:hover, #sidebar ul li a:focus {
  color: #859bba;
}

.card {
  margin: 1% 2% 3% 2% ! IMPORTANT;
}

h3 {
  margin: 2% 2% 0% 2% ! IMPORTANT;
  color: #fff ! IMPORTANT;
  font-weight: unset ! IMPORTANT;
  text-transform: unset ! IMPORTANT;
}

.card {
  background-color: #ffffff42 ! IMPORTANT;
  color: white ! IMPORTANT;
}

th {
  background: #070b1087 ! IMPORTANT;
}

p {
  color: #ffffff! IMPORTANT;
  font-size: 14px! IMPORTANT;
}

/* .edit_button {
  margin:3 px! IMPORTANT;;
  cursor: pointer! IMPORTANT;
  color: white! IMPORTANT;
  padding: 2%! IMPORTANT;
  border: 1px solid #ffffff61! IMPORTANT;
  border-radius: 3% ! IMPORTANT;
  background-color: #070b1059! IMPORTANT;
} */

.btn-add{
  cursor: pointer! IMPORTANT;
	background-color: #6f829859! IMPORTANT;
	color: #fff! IMPORTANT;
  font-size: 12px ! IMPORTANT;
  margin-left: 2% ! IMPORTANT;
  margin-top: 1%! IMPORTANT;
}

.btn-add:hover{
  color: #fff! IMPORTANT;
	background-color: #b5bcc559! IMPORTANT;
}

.btn-edit{
  cursor: pointer! IMPORTANT;
	background-color: #070b1059;
	color: #fff;
  font-size: 12px ! IMPORTANT;
}

.btn-edit:hover{
  color: #fff! IMPORTANT;
	background-color: #6d86a559;
}


.content-section {
  color: white! IMPORTANT;
}

.form-submit-button {
  margin:3 px! IMPORTANT;;
  cursor: pointer! IMPORTANT;
  color: white! IMPORTANT;
  background-color: #6d757d! IMPORTANT;
}

.form-submit-button:hover {
  color: white! IMPORTANT;
  background-color: #2ec60066! IMPORTANT;
}

.form-cancel-button:hover{
  color: white! IMPORTANT;
  background-color: #c6000066! IMPORTANT;

}

.page-head{
  padding: 1.25rem;
  color: white !IMPORTANT;
}

h4{
  margin-bottom: unset !IMPORTANT;
}

.button-container {
  margin-top: 2.25rem !IMPORTANT;
}


/* Extra small devices (phones, 600px and down) */
@media only screen and (max-width: 600px) {
  .content-section{
    width: 100% !IMPORTANT;
  }

  .edit_button {
    white-space: normal;
    word-wrap: break-word !important;
    font-size: 10px !important;
  }

  .company-logo-img{
    height:7% !important;
    width:70% !important;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
  }

}

/* Small devices (portrait tablets and large phones, 600px and up) */
@media only screen and (min-width: 600px) {
  .content-section{
    width: 100% !IMPORTANT;
  }

  .edit_button {
    white-space: normal;
    word-wrap: break-word !important;
    font-size: 10px !important;
  }

  .company-logo-img{
    height:8% !important;
    width:60% !important;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
  }

}

/* Medium devices (landscape tablets, 768px and up) */
@media only screen and (min-width: 768px) {
  .content-section{
    width: 70% !IMPORTANT;
  }

  .company-logo-img{
    height:8% !important;
    width:50% !important;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
  }

}

/* Large devices (laptops/desktops, 992px and up) */
@media only screen and (min-width: 992px) {
  .content-section{
    width: 50% !IMPORTANT;
  }

  .company-logo-img{
    height:8% !important;
    width:40% !important;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
  }

}

/* Extra large devices (large laptops and desktops, 1200px and up) */
@media only screen and (min-width: 1200px) {
  .content-section{
    width: 50% !IMPORTANT;
  }

  .company-logo-img{
    height:10% !important;
    width:40% !important;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
  }

}

.auth-buttons{
  display: flex;
  flex-direction: column;
  position: absolute;
  top: 60%;
  left: 50% !important;
  transform: translate(-50%, -50%);

}



a.text-sm.text-gray-700.dark\:text-gray-500.underline {
  text-align: center;
  width: 100% !important;
  margin-bottom: 5% !important;
}

/* .btn-add{
  background-color: #474a4e;
  cursor: pointer;
  width: 100px;
  margin-left: 2% ! IMPORTANT;
  margin-top: 1%;
} */

.ununsed-license-count {
  padding-left: 1.25rem;
  padding-top: 1.25rem;
  margin-bottom: unset !important;
}

.unused{
  color: #c5e243;
}

.p-4.sm\:p-8.bg-white.dark\:bg-gray-800.shadow.sm\:rounded-lg {
  background-color: #ffffff42 ! IMPORTANT;
}

.welcome-message{
  color: white !important;
}

.add{
  color: rgb(255, 255, 255) !important;
}

.company-logo-img{
  text-align: center !important;
}

.welcome-styling{
  background-color: black !important;
}

a.text-sm.text-gray-700.dark\:text-gray-500.underline {
  border: 1px solid #ccea46;
  padding: 6px 27px;
  border-radius: 5% !important;
  color: #ccea46;
  text-decoration: none;
}

a.text-sm.text-gray-700.dark\:text-gray-500.underline:hover {
  border: 1px solid #384a60;
  color: #384a60;
  text-decoration: none;
}

.center {
  position: absolute;
  left: 50%;
  transform: translate(-50%, -50%);
  padding: 10px;
}

.company-logo-auth{
  position: absolute;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 320px !important;
  height: 75px !important;
}

.w-full.sm\:max-w-md.mt-6.px-6.py-4.bg-white.dark\:bg-gray-800.shadow-md.overflow-hidden.sm\:rounded-lg {
  border: 1px solid #384a60;
}

.dark\:bg-gray-800 {
  --tw-bg-opacity: 1;
  background-color: rgb(0 0 0) !important;
}

.notes{
  font-size: 11px !important;
}

.account-not-approved-messsage{
  color: red !important;
}

.warnings{
  color: red !important;
}

.welcome-links-heading{
  color: white;
  text-decoration: underline;
}

.welcome-links{
  color: white;
}

.welcome-links:hover{
  color: #abc43b;
}

.search-section {
  padding: 1%;
}

.search-section-items {
  display: flex;
  column-gap: 5px;
}

form#search_form {
  margin-left: 8px;
  margin-right: 6px;
  margin-top: 12px;
}

span.relative.inline-flex.items-center.text-sm.font-medium.text-gray-500.bg-white.border.border-gray-300.cursor-default.leading-5.rounded-md {
  background-color: #14171a !important;
  cursor: pointer!important;
  padding-bottom: 0!important;
  margin-bottom: 0!important;
  padding-bottom: 6px !important;
}

a.relative.inline-flex.items-center.ml-3.text-sm.font-medium.text-gray-700.bg-white.border.border-gray-300.leading-5.rounded-md.hover\:text-gray-500.focus\:outline-none.focus\:ring.ring-gray-300.focus\:border-blue-300.active\:bg-gray-100.active\:text-gray-700.transition.ease-in-out.duration-150 {
  background-color: #14171a !important;
  cursor: pointer!important;
  padding-bottom: 0!important;
  margin-bottom: 0!important;
  padding-bottom: 6px !important;
}

a.relative.inline-flex.items-center.text-sm.font-medium.text-gray-700.bg-white.border.border-gray-300.leading-5.rounded-md.hover\:text-gray-500.focus\:outline-none.focus\:ring.ring-gray-300.focus\:border-blue-300.active\:bg-gray-100.active\:text-gray-700.transition.ease-in-out.duration-150{
  background-color: #14171a !important;
  cursor: pointer!important;
  padding-bottom: 0!important;
  margin-bottom: 0!important;
  padding-bottom: 6px !important;
}

.page-footer {
  margin: 1% 2% 3% !important;
  text-align: end;
}

.hidden.sm\:flex-1.sm\:flex.sm\:items-center.sm\:justify-between {
  display: none;
}
/* 
span.relative.inline-flex.items-center.px-4.py-2.text-sm.font-medium.text-gray-500.bg-white.border.border-gray-300.cursor-default.leading-5.rounded-md {
  padding-bottom: 6px !important;
} */