body {
  padding-top: 5rem;
  overflow-x: hidden; /* Prevent scroll on narrow devices */
}
main {
	font-size: 0.8em;	
}
h1 {
	font-size: 1.8em;
}
h2 {
	font-size: 1.4em;
}
h3 {
	font-size: 1.1em;
	margin-top: 1em;
}

.card-body {
	padding: 8px;
	font-size: 11px;
	line-height: 1.3em;
}

.col h3 {
  text-align: center;
}

.col i {
  font-style: normal;
  color: #666;
  font-size: x-small;
}

/*
 * Off Canvas
 * --------------------------------------------------
 */
@media screen and (max-width: 1199.99px) {
  .row-offcanvas {
    position: relative;
    transition: all .25s ease-out;
  }

  .row-offcanvas-right {
    right: 0;
  }

  .row-offcanvas-left {
    left: 0;
  }

  .row-offcanvas-right .sidebar-offcanvas {
    right: -100%; /* 12 columns */
  }

  .row-offcanvas-right.active .sidebar-offcanvas {
    right: -50%; /* 6 columns */
  }

  .row-offcanvas-left .sidebar-offcanvas {
    left: -100%; /* 12 columns */
  }

  .row-offcanvas-left.active .sidebar-offcanvas {
    left: -50%; /* 6 columns */
  }

  .row-offcanvas-right.active {
    right: 50%; /* 6 columns */
  }

  .row-offcanvas-left.active {
    left: 50%; /* 6 columns */
  }

  .sidebar-offcanvas {
    position: absolute;
    top: 0;
    width: 50%; /* 6 columns */
  }
}