/* Fonts */
@import url('https://fonts.googleapis.com/css?family=Cabin');
@import url('https://fonts.googleapis.com/css?family=IBM+Plex+Mono');

body {
  height: 100%;
  overflow-x: hidden;
  font-family: 'Cabin', sans-serif;
}

.sidebar-wrapper {
  background-color: #224abe;

}

.nav-link, .collapse-item {
  cursor: pointer;
}

.include-d-none {
  display: none;
}

.include-d-block {
  display: block;
}

/* Styles for Pages */
header {text-align: center;}
header .intro-text {padding-top: 50px; padding-bottom: 50px;}
header .intro-text .intro-heading {margin-bottom: 25px; font-size: 50px; line-height: 50px; color: #333}
header input {
  text-align: center;
}
header .input-group {
  margin: 0 auto;
  width: 75%;
}
@media(min-width:768px) {
  header .intro-text {padding-top: 50px;padding-bottom: 50px;}
  header .intro-text .intro-heading {margin-bottom: 50px; font-size: 75px; line-height: 75px;}
}

#myTable {
    border-collapse: collapse; /* Collapse borders */
    width: 100%; /* Full-width */
    border: 1px solid #ddd; /* Add a grey border */
    font-size: 18px; /* Increase font-size */
}

#myTable th, #myTable td {
    text-align: left; /* Left-align text */
    padding: 12px; /* Add padding */
}

#myTable tr {
    /* Add a bottom border to all table rows */
    border-bottom: 1px solid #ddd;
}

#myTable tr.header, #myTable tr:hover {
    /* Add a grey background color to the table header and on hover */
    background-color: #f1f1f1;
}

#myTable .btn {
    font-size: 16px;
    border: 1px solid #ced4da;
}

@media(min-width:768px) {
  #myTable .btn {
    margin-right: -35px;
  }
}

#kbTable {
    border-collapse: collapse; /* Collapse borders */
    width: 100%; /* Full-width */

    font-size: 18px; /* Increase font-size */
}

#kbTable th, #kbTable td {
    text-align: left; /* Left-align text */
    padding: 12px; /* Add padding */
}

#kbTable tr {
    /* Add a bottom border to all table rows */
    border-bottom: 1px solid #ddd;
}

#kbTable tr.header, #kbTable tr:hover {
    /* Add a grey background color to the table header and on hover */
    background-color: #f1f1f1;
}

#kbTable .btn {
    font-size: 16px;
    border: 1px solid #ced4da;
}

@media(min-width:768px) {
  #kbTable .btn {
    margin-right: -35px;
  }
}

.icon-disabled {
  color: #bbb;
}

.icon-m {
  font-size: 30px;
}

i.fa-info,
i.fa-info:hover,
i.fa-info:focus {
  font-size: 12px;
  color: #333;
}

i.fa-info.icon-disabled {
  color: #bbb;
}

i.fa-cloud-download-alt,
i.fa-cloud-download-alt:hover,
i.fa-cloud-download-alt:focus {
  font-size: 16px;
  color: #333;
}

i.fa-cloud-download-alt.icon-disabled {
  color: #bbb;
}

.btn {
  color: #333;
  background: #eee;
}

.btn.btn-disabled {
  color: #bbb;
}

.link-2 {
  text-decoration: none;
  color: #333;
  font-size: 12px;
}

.code {
  padding: 1rem;
  background-color: #fff;
}

a,
a:hover {
  color: #858796;
  text-decoration: none;
}

.std-square {
  position: relative;
  height: 15rem;
  width: 100%;
}

@media (min-width: 768px) {
  .std-square {
    height: calc(17rem - 43px) !important;
  }
}

.iframe-square {
  position: relative;
  height: 15rem;
  width: 100%;
  overflow-y: hidden;
}

@media (min-width: 768px) {
  .iframe-square {
    height: calc(17rem - 43px) !important;
  }
}

iframe {
  height: 15rem;
  width: 100%;
  border: none;
}
