html, body {
      height: 100%;
      margin: 0;
      padding: 0;
      overflow: hidden;
    }

    body {
      display: flex;
      flex-direction: column;
    }
	
	.card-box .inner {
	height: 65px; /* fix height to original */
	padding-bottom: 8px; /* adjust padding to fit */
	overflow: hidden; /* prevent inner from expanding */
	}

	.card-box .inner small {
	font-size: 0.65rem; /* smaller font */
	line-height: 1; /* tighter line height */
	color: #f8d7da; /* soft color */
	display: block; /* ensure it takes a new line */
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	margin-top: 4px; /* small spacing from main title */
	}
	
    .c-wrapper {
      flex: 1;
      display: flex;
      flex-direction: column;
      min-height: 0;
    }

    .c-body {
      flex: 1;
      display: flex;
      flex-direction: column;
      min-height: 0;
      overflow: hidden;
    }

    .c-main {
      flex: 1;
      overflow-y: auto;
      -webkit-overflow-scrolling: touch;
    }

    .container-fluid {
      height: 100%;
      padding: 15px;
      box-sizing: border-box;
    }

    @media (max-width: 767.98px) {
      .col-xs-12 {
        width: 100%;
      }

      .card-box {
        margin-bottom: 15px;
      }
    }