/*!
 * Bootswatch v5.1.3
 * Homepage: https://bootswatch.com
 * Copyright 2012-2021 Thomas Park
 * Licensed under MIT
 * Based on Bootstrap
*/
/*!
 * Bootstrap v5.1.3 (https://getbootstrap.com/)
 * Copyright 2011-2021 The Bootstrap Authors
 * Copyright 2011-2021 Twitter, Inc.
 * Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE)
 */
@import url("https://fonts.googleapis.com/css2?family=Montserrat:wght@400;500;700&display=swap");
:root {
  --bs-blue: #007bff;
  --bs-indigo: #6610f2;
  --bs-purple: #6f42c1;
  --bs-pink: #e83e8c;
  --bs-red: #ff7851;
  --bs-orange: #fd7e14;
  --bs-yellow: #ffce67;
  --bs-green: #56cc9d;
  --bs-teal: #20c997;
  --bs-cyan: #6cc3d5;
  --bs-white: #fff;
  --bs-gray: #888;
  --bs-gray-dark: #343a40;
  --bs-gray-100: #f8f9fa;
  --bs-gray-200: #f7f7f9;
  --bs-gray-300: #eceeef;
  --bs-gray-400: #ced4da;
  --bs-gray-500: #aaa;
  --bs-gray-600: #888;
  --bs-gray-700: #5a5a5a;
  --bs-gray-800: #343a40;
  --bs-gray-900: #212529;
  --bs-primary: #78c2ad;
  --bs-secondary: #f3969a;
  --bs-success: #56cc9d;
  --bs-info: #6cc3d5;
  --bs-warning: #ffce67;
  --bs-danger: #ff7851;
  --bs-light: #f8f9fa;
  --bs-dark: #343a40;
  --bs-primary-rgb: 120, 194, 173;
  --bs-secondary-rgb: 243, 150, 154;
  --bs-success-rgb: 86, 204, 157;
  --bs-info-rgb: 108, 195, 213;
  --bs-warning-rgb: 255, 206, 103;
  --bs-danger-rgb: 255, 120, 81;
  --bs-light-rgb: 248, 249, 250;
  --bs-dark-rgb: 52, 58, 64;
  --bs-white-rgb: 255, 255, 255;
  --bs-black-rgb: 0, 0, 0;
  --bs-body-color-rgb: 136, 136, 136;
  --bs-body-bg-rgb: 255, 255, 255;
  --bs-font-sans-serif: system-ui, -apple-system, "Segoe UI", Roboto,
    "Helvetica Neue", Arial, "Noto Sans", "Liberation Sans", sans-serif,
    "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
  --bs-font-monospace: SFMono-Regular, Menlo, Monaco, Consolas,
    "Liberation Mono", "Courier New", monospace;
  --bs-gradient: linear-gradient(
    180deg,
    rgba(255, 255, 255, 0.15),
    rgba(255, 255, 255, 0)
  );
  --bs-body-font-family: var(--bs-font-sans-serif);
  --bs-body-font-size: 1rem;
  --bs-body-font-weight: 400;
  --bs-body-line-height: 1.5;
  --bs-body-color: #888;
  --bs-body-bg: #fff;

  /* PLSLWD colors */
  --bs-primary: #002f5d;
  --bs-primary-rgb: 0, 47, 93;
  --bs-secondary: #75bc20;
  --bs-secondary-rgb: 117, 188, 32;
}

html {
  position: relative;
  min-height: 100%;
}

body {
  margin-bottom: 50px;
}

.nav-tabs > .nav-item > .active {
  border-color: var(--bs-secondary);
  background-color: var(--bs-secondary);
}

.nav-tabs > .nav-item:hover {
  border-color: var(--bs-secondary);
  background-color: var(--bs-secondary);
  border-radius: 5px;
}

/* Dropdown Button */
.dropbtn {
  color: white;
  padding: 8px;
  font-size: 32px;
  border: none;
}

/* Change the color of the dropdown button on hover */
.dropbtn:hover {
  color: var(--bs-secondary);
}

/* The container <div> - needed to position the dropdown content */
.dropdown {
  position: relative;
  display: inline-block;
}

/* Dropdown Content (Hidden by Default) */
.dropdown-content {
  display: none;
  position: absolute;
  background-color: #f1f1f1;
  min-width: 200px;
  box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
  z-index: 1;
}

/* Links inside the dropdown */
.dropdown-content a {
  color: var(--bs-primary);
  padding: 12px 16px;
  text-decoration: none;
  display: block;
}

/* Change color of dropdown links on hover */
.dropdown-content a:hover {
  background-color: white;
}

/* Show the dropdown menu on hover */
.dropdown:hover .dropdown-content {
  display: block;
}

/* Change the background color of the dropdown button when the dropdown content is shown */
.dropdown:hover .dropbtn {
  background-color: var(--bs-primary);
}

.tab-content {
  background-color: var(--bs-secondary);
  padding: 5px;
}

.form-wrapper {
  border: solid var(--bs-secondary) 5px;
  padding: 20px 10px 20px;
}

label {
  float: right;
  vertical-align: middle;
}

span {
  display: block;
  overflow: hidden;
  padding: 0px 4px 0px 6px;
}

input {
  width: 70%;
}

.checkbox {
  width: 25%;
}

.tab-pane {
  background-color: white;
}

.navbar {
  font-weight: bold;
  font-size: 125%;
  margin-bottom: 10px;
}

.dropdown-item {
  font-size: 110%;
}

a.new-tab:after {
  font-family: "FontAwesome";
  content: " \f08e";
}

a.disabled {
  pointer-events: none;
}

.new-section {
  width: 100%;
  height: 10px;
  border: 0px none;
  margin-right: auto;
  margin-left: auto;
  margin-top: 40px;
  margin-bottom: 40px;
  background-color: var(--bs-primary);
}

h1 {
  width: 100%;
  margin: 20px auto;
  /* text-transform: uppercase; */
  color: white;
  padding: 10px 20px 10px 20px;
  line-height: 1.6;
  position: relative;
  background: var(--bs-primary);
  font-size: 32pt;
  font-family: "Mate SC", serif;
}

h2 {
  font-size: 28pt;
}

h3 {
  font-size: 20pt;
}

h4,
h5,
h6 {
  font-size: 16pt;
}

h6 {
  font-style: italic;
}

h2,
h5 {
  /* color: white; */
}

h3,
h6 {
  color: var(--bs-primary);
}

h4 {
  color: var(--bs-primary);
}

/* gives color to the activate, edit and delete buttons on all admin pages */

/*
a.clickbutton {
  color: var(--bs-primary);
}
*/

/* changes the hover for the administer.php */
table,
td {
  max-width: 100%;
  white-space: wordwrap;
}

.table-hover > tbody > tr:hover a.clickbutton {
  color: var(--bs-secondary);
}

th,
tr {
  font-size: 100%;
}

td.break {
  word-break: break-all;
}

th {
  color: white;
  background-color: var(--bs-primary);
}

tr {
  background-color: white;
}

.table-hover > thead > tr {
  background-color: var(--bs-primary);
}

.table-hover > thead > tr:hover {
  color: white;
}

.th-sortable:hover {
  color: var(--bs-secondary);
}

.table-hover > tbody > tr:hover {
  background-color: var(--bs-secondary);
  color: white;
}

.table-hover > tbody > tr:hover a {
  color: var(--bs-secondary);
}

.table-hover > tbody > tr:hover {
  background-color: var(--bs-secondary);
  color: white;
}

.table-hover > tbody > tr > td:hover a {
  color: var(--bs-secondary);
}

.th-sortable {
  cursor: pointer;
  color: var(--light);
}

.tbl-content-center {
  text-align: center;
}

.table-fees {
  border: solid 1px black;
}

.table-hover tbody tr:hover td,
.table-hover tbody tr:hover th {
  background-color: var(--bs-secondary);
  color: var(--bs-white);
}

.table-hover tbody tr a.clickbutton {
  color: var(--bs-secondary);
}

.table-hover tbody tr:hover a.clickbutton {
  color: var(--bs-primary);
}

/* ---------------------------- */

.dropdown-menu {
  margin-top: -1px;
  border-top-left-radius: 0;
  border-top-right-radius: 0;
}

.btn-top {
  margin-bottom: 1em;
}

.btn-bottom {
  margin-bottom: 1em;
}

.btn-left {
  float: left;
}

.btn-right {
  float: right;
}

.btn-primary {
  background-color: var(--bs-primary);
}

.btn-primary:hover {
  background-color: var(--bs-secondary);
}

.btn {
  outline: none;
  border: 0px;
}

.link-left {
  float: left;
}

.link-right {
  float: right;
}

footer {
  position: absolute;
  bottom: 0;
  width: 100%;
  height: 50px;
  padding: 20px;
}

.footer-title {
  float: left;
  color: var(--bs-primary);
  font-weight: bold;
}

.footer-title > a {
  color: var(--bs-primary);
}

.footer-title > a:hover {
  color: var(--bs-secondary);
}

.footer-social-links svg {
  float: right;
  width: 20px;
  height: 20px;
  margin-left: 10px;
  fill: var(--bs-primary);
}

.footer-social-links svg:hover {
  fill: var(--bs-secondary);
}

.footer-social-links a:not(:first-child) {
  margin-left: 6px;
}

.footer-social-links a,
.footer-social-links a:hover {
  text-decoration: none;
}

.card {
  box-shadow: 0 4px 8px 0 lightgrey;
  transition: 0.3s;
  margin: 0 auto;
  float: none;
  margin-bottom: 10px;
  background-color: lightgrey;
}

.card:hover {
  box-shadow: 0 8px 16px 0 lightgrey;
}

.form-label-group {
  padding-top: 5px;
  padding-bottom: 5px;
}