/* Colors */
/* Color Usage */
/* Style Defaults */
/* Spacing */
/* Breakpoints */
/** 
* X Height Offsets 
* Used for aligning the top of side by side columns when one colum
* has an image and the other has text/header 
*/
/* Easings*/
.jquery-tab:not(.active) {
  display: none; }

.jquery-tab-btn {
  flex: 1 1 0;
  /* border-bottom: 1px solid $gray-l; */ }
  .jquery-tab-btn a {
    position: relative;
    transition: all 250ms ease;
    border-bottom-width: 5px;
    line-height: 1.5;
    height: 100%;
    border-bottom-style: solid;
    border-bottom-color: transparent;
    padding: 16px;
    display: block;
    text-align: center;
    color: #0CABF9;
    text-decoration: none; }
    .jquery-tab-btn a.has-arrow {
      border-width: 3px; }
    .jquery-tab-btn a.has-arrow::after {
      position: absolute;
      right: 0;
      bottom: -8px;
      left: 0;
      width: 0;
      height: 0;
      margin: auto;
      content: '';
      transition: opacity 50ms ease;
      opacity: 0;
      border-top: 8px solid #0CABF9;
      border-right: 8px solid transparent;
      border-left: 8px solid transparent; }
    .jquery-tab-btn a img {
      transition: all 250ms ease;
      opacity: 0.5; }
  .jquery-tab-btn a:focus,
  .jquery-tab-btn a:hover {
    border-bottom-color: #d9eaf8; }
    .jquery-tab-btn a:focus img,
    .jquery-tab-btn a:hover img {
      opacity: 1; }
  .jquery-tab-btn a.active {
    border-bottom-color: #0CABF9; }
    .jquery-tab-btn a.active img {
      opacity: 1; }
    .jquery-tab-btn a.active.has-arrow::after {
      transition: opacity 100ms ease;
      transition-delay: 100ms;
      opacity: 1; }