/* style the mobile version */
/*    body {
      font-family: sans-serif;
      background: #f9f8fc;
      margin: 0;
      padding: 1em;
    }*/

    .show-card {
      border: 3px solid #ddd;
      border-radius: 10px;
      margin-bottom: .5em;
      padding: .5em;

    }

    .show-card.now { border:3px solid black!important; }
    .show-card.recent { border:3px solid darkgrey!important; }

    .mobile-header-row {
      display: flex;
      justify-content: space-between;
      align-items: center;
      margin-bottom: 0.5em;
    }

    .mobile-day-label {
      font-size: .9em;
      font-weight: bold;
      text-transform: uppercase;
      font-family:'PT Sans Narrow', sans-serif;
      color: #333;
      width:70px;
    }
    .mobile-day-label i { font-size:8pt; }

/*
    div.show-card.wednesday .mobile-day-label {
      font-size:.9em;
    }
*/
    .mobile-timezone-table {
      font-family: 'Ubuntu Mono', monospace;
      font-weight:400;
      font-size: 0.65em;
      background: transparent; /* #ffeeba; */
      border-radius: 4px;
      margin: 5px;
    }

    .mobile-timezone-table table {
      border-collapse: collapse;
    }

    .mobile-timezone-table th,
    .mobile-timezone-table td {
      padding: 0 0.5em;
      text-align: center;
      width:36px;
      background-color:#ffeeba;
    }

    /* round out the four corners of the timezone table */
    .mobile-timezone-table th:first-child { border-top-left-radius:    6px; }
    .mobile-timezone-table td:first-child { border-bottom-left-radius: 6px; }
    .mobile-timezone-table th:last-child  { border-top-right-radius:   6px; }
    .mobile-timezone-table td:last-child  { border-bottom-right-radius:6px; }

    /* add right border except on last cell */
    .mobile-timezone-table th:not(:last-child) {
      border-right: 1px solid #999;
    }
    .mobile-timezone-table td:not(:last-child) {
      border-right: 1px solid #999;
    }

    .mobile-title {
      font-size: 1.5em;
      margin-bottom: 0.3em;
      font-family: "Be Vietnam Pro", sans-serif;
      font-weight: 500;
    }

    .mobile-title .marathon {
      font-family: "Atma", sans-serif;
      font-weight:500;
      font-size:1.85em;
    }

    .mobile-title .marathon::before {
      content: "\f0e7";
      font-family: "Font Awesome 5 Free"; 
      font-weight: 800;  
      margin-right: 8px;
      font-size:18pt;
    }

    .mobile-title .marathon::after {
      content: "\f0e7";
      font-family: "Font Awesome 5 Free"; 
      font-weight: 800;  
      margin-left: 8px;
      font-size:18pt;
    }

    .mobile-details { 
      display: flex; 
      align-items: flex-start;
      font-size: 0.9em;
      color: #444;
      flex-wrap: wrap;
      gap: 1em;
    }

    .mobile-details a {
      color: #0066cc;
      text-decoration: none;
    }

    .mobile-details a:hover {
      text-decoration: underline;
    }

    .mobile-avatar-image img { 
      width: 55px; 
      height: auto; 
      margin-right: 10px; 
      border-radius:50% 50%;
    }

    .mobile-text { 
      display: flex; 
      flex-direction: column; 
    }
    
    .mobile-handle { 
      font-family: "Be Vietnam Pro", sans-serif;
      font-weight: 400;
      font-size:1.45em;
    }

    .mobile-platform { 
      font-family: "Be Vietnam Pro", sans-serif;
      font-weight:300; 
      font-size: 1.40em; 
    } 

    .mobile-platform a {
      margin-left:-4px;
      padding-top:9px;
    }

    .timezones span:not(:last-child)::after {
      content: "|";
      margin-left: 0.5em;
      color: #888;
    }

    .mobile-tools {
      margin-top: 15px;
      padding: 20px;
      color:white;
      background-color: black;
      margin-bottom: -9px;
      margin-left: -9px;
      margin-right: -9px;
      border-bottom-left-radius: 10px;      
      border-bottom-right-radius: 10px;      
    }

    .mobile-tools-toggle {
      float:right;
      margin-top:-16px;
    }
    .mobile-tools.hidden {display:none;}

    div.mobile-timezone-table table tbody tr .timezone-highlight { background-color:gold!important; }