:root {

      --font_size_button_label_desktop: clamp(18px, calc(18px + 0.25vw),24px); /* 24px Button label: scales between ~14px and 20px  calc( var(--font-size) * 1.4); */
      --font_size_button_label_iPad:  calc(var(--font_size_button_label_desktop)*0.95) /* 18px; */
      --font_size_button_label_iPhone: calc(var(--font_size_button_label_desktop)*0.9) /* 18px; */

}


  #inrow {
    display:block;
  }

  #incolumn {
    display:none;
  }

  .outer-container {
      border: var(--border_size) dashed black;
      padding: 20px;
      max-width: 100%;
      margin: 0 auto;
      display: flex;
      flex-direction: row;
      justify-content: space-between;
      gap: 20px;
  }
  
     .outer-container > * { 
        margin: 0 7px; /* Adds 0px margin to the top and bottom, 10px to the left and right */  
    }

  .inner-container {
      border: var(--border_size) dotted green;
      padding: 10px, 20px;
      display: flex;
      flex-direction: column;
      flex: 1; /* Allow inner containers to grow and shrink to fill available space */
  }

  .button-location {
      padding: 15px 20px;
      text-align: center;
      border-radius: 5px;
      margin-bottom: 10px;
      font-size:16px;
      text-decoration: none;
      color: white;
      font-size: calc(var(--font_size_button_label_desktop) *1 );
  }

  .blue-button {
      background-color: #006db0; /*#00bfff;  #1e90ff ; */
      color: white;
  }

  .green-button {
      background-color: green;
      color: white;
  }

  @media (max-width: 768px) {
      .outer-container {
          flex-direction: column;
          align-items: center; /* Center the inner containers vertically */
          gap:0px;
      }

      .inner-container {
          width: 100%; /* Make the inner container full width on smaller screens */
      }

  }


  .button-location:hover {
    background-color: var(--button_red) !important;
    color: white;
  }

  .button_text_full {
    display: inline; /* Show the full text by default */
  }

  .button_text_short {
    display: none; /* Hide the short text by default */
  }

  /* Responsive styles 768px - loc links */
  @media (max-width: 768px) {

    .button-location {
        font-size: calc(var(--font_size_button_label_iPad) *1 );
    }



    #inrow {
      display:none;
    }

    #incolumn {
      display:block;
    }

  }

  /* Responsive styles 480px - loc links */
  @media (max-width: 480px) {

  }


  /* Media query for screens smaller than 400px */
  @media (max-width: 400px) {

        .button_text_full {
          display: none !important;
        }
        .button_text_short {
          display: inline !important;
        }

  }