/*RESET*/
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, u, i, li, a, center, dl, dt, dd, ol, ul, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {
	margin:0;
	padding:0;
	border:0;
	outline:0;
	font-size:100%;
	vertical-align:baseline;
	background:#f3f3f3;
	color: #000000;
  }
  body {line-height: 1;}
  ol, ul{list-style:none;}
  blockquote, q{quotes:none;}
  blockquote:before, blockquote:after, q:before, q:after{content:'';content:none;}
  :focus{outline:0;}
  ins{text-decoration:none;}
  del{text-decoration:line-through;}
  table{border-collapse:collapse; border-spacing:0;}

  /*MAIN*/
  body
  {
	  font-size: 1.05em;
	  line-height: 1.25em;
	  background: #f3f3f3;
	  color: #000000;
  }

  a
  {
	  text-decoration: none;
          background-color: transparent;
  }

  a:link, a:visited
  {
	  color: #000000;
	  text-decoration: none;
          background-color: transparent;
  }

  a:hover, a:active
  {
	  color: #ff0000;
          background-color: transparent;
  }

  header
  {
	  background: #f3f3f3;
	  width: 100%;
	  height: 100px;
	  position: fixed;
	  top: 0;
	  left: 0;
	  z-index: 100;
  }

  #logo {
    margin: 20px;
    float: left;
    display: flex;
    align-items: center;
}

#logo img {
    height: 40px;
    width: 40px;
    border-radius: 10px;
}

#logo h1 {
    margin-left: 10px;
    font-size: 24px;
    color: #fff;
}


nav
{
    float: center;
    padding: 20px;
}

  #menu-icon
  {
	  display: hidden;
	  width: 40px;
	  height: 40px;
	  background: #4C8FEC url(../img/menu-icon.svg) center;
  }

  a:hover#menu-icon
  {
	  background-color: #444;
	  border-radius: 4px 4px 0 0;
  }

  ul
  {
	  list-style: none;
  }

  li
  {
	  display: inline-block;
	  float: left;
	  padding: 10px;
          color: #000000;
  }

  .current
  {
	  color: #ff0000;
  }

  section
  {
	  margin: 40px 0px 0px;
	  max-width: 2400px;
	  position: relative;
	  padding: 20px;
	  padding-top: 80px;
	  background: #f3f3f3;
  }

  h1
  {
	  color: #000000;
	  line-height: 1.15em;
	  margin: 20px 0 ;
  }

  p
  {
	  line-height: 1.45em;
	  color: #000000;
	  margin-bottom: 20px;
  }

  .fighter-image {
    width: 100%; /* Make the image take up the full width of the parent container */
    height: auto; /* Set height to auto */
    object-fit: contain; /* The image will be scaled to maintain its aspect ratio while fitting within the element’s content box. */
}

table {
  width: 100%;
  border-collapse: collapse;
}
th, td {
  padding: 8px;
  text-align: left;
  border-bottom: 1px solid #ddd; /* This creates a line between rows */
  vertical-align: middle;
}
th {
  background-color: #f2f2f2; /* This is a light grey background for the header */
  color: black;
}

tr:nth-child(even) {background-color: #f9f9f9;} /* This zebra stripes the table rows */
.button-link {
  text-decoration: none;
  color: white;
  background-color: #007bff; /* Bootstrap primary color */
  padding: 5px 10px;
  border-radius: 5px;
  font-size: 14px;
}
.button-link:hover {
  background-color: #0056b3; /* A darker shade for hover effect */
}

tr:nth-child(even) {background-color: #bbb8b894;} /* This zebra stripes the table rows */

.clickable-row {
  cursor: pointer;
}


.footer-basic {
  padding:40px 0;
  background-color:#f3f3f3;
  color:#4b4c4d;
  text-align:center;
}

.footer-basic ul {
  padding:0;
  list-style:none;
  text-align:center;
  font-size:18px;
  line-height:1.6;
  margin-bottom:0;
  display:flex;
  justify-content: center;
}

.footer-basic li {
  padding:0 10px;
}

.footer-basic ul a {
  color:inherit;
  text-decoration:none;
  opacity:0.8;
}

.footer-basic ul a:hover {
  opacity:1;
}


@media (max-width: 640px) {

  .m-order-1 {
    order: 1;
  }

  .m-order-2 {
    order: 2;
  }

  .m-order-3 {
    order: 3;
  }

  .m-order-4 {
    order: 4;
  }

  .m-order-5 {
    order: 5;
  }

  .m-order-6 {
    order: 6;
  }

  .m-order-7 {
    order: 7;
  }

  .m-order-8 {
    order: 8;
  }

  .m-order-9 {
    order: 9;
  }

  .m-order-10 {
    order: 10;
  }

  .m-order-11 {
    order: 11;
  }

  .m-order-12 {
    order: 12;
  }

  .m-order-13 {
    order: 13;
  }

  .m-order-14 {
    order: 14;
  }

  .m-order-15 {
    order: 15;
  }

  .m-order-16 {
    order: 16;
  }

  .m-order-17 {
    order: 17;
  }

  .m-order-18 {
    order: 18;
  }

}

@media screen and (max-width: 920px) {
  .show-on-desktop {
    display: none;
  }
}

@media screen and (min-width: 500px) {
  .show-on-mobile {
    display: none;
  }
}

.table-responsive {
    max-height:300px;
    display: block;
    overflow-y: auto;
}

.table-responsive-long {
    max-height:3000px;
}

.dropdown-menu {
  max-height: 100px;
  overflow-y: scroll;

}

.table tbody tr td a:hover {
  background-color: inherit;
}

.table-hover tbody tr:hover a {
  background-color: inherit;
}


.dropdown-menu label {
  display: inline-block;
  white-space: nowrap;
}