html, body, * {
  font-family: "Arial", Arial, "Times New Roman", serif !important;
  /*font-family: "Palatino Linotype", Palatino, "Times New Roman", serif !important;*/
}

figure { margin: 1.0em 0 0.8em 0; }
figure img { max-width: 35%; height: auto;  }
figure:nth-of-type(even)  img { float: left;  margin-right: 1rem; }
figure:nth-of-type(odd) img { float: right; margin-left:  1rem; }

figure video { max-width: 35%; height: auto;  }
figure:nth-of-type(even)  video { float: left;  margin-right: 1rem; }
figure:nth-of-type(odd) video { float: right; margin-left:  1rem; }

/*p { overflow: auto; }*/





/*
.media:nth-of-type(odd)  {
  float: left;
  width: 35%;
  max-width: 320px;
  margin: 0.2rem 0 1rem 1rem;
  shape-outside: inset(0 round 12px);
  shape-margin: 0.75rem;
}

.media:nth-of-type(even)  {
  float: right;
  width: 35%;
  max-width: 320px;
  margin: 0.2rem 0 1rem 1rem;
  shape-outside: inset(0 round 12px);
  shape-margin: 0.75rem;
}
*/


.about {
  max-width: 800px;
  margin: 2rem auto 0;
  text-align: justify;
  /*text-justify: inter-word;*/
  line-height: 1.6;
}
.about p {
  margin-top: 1em;
  /*text-indent: 1.5em;*/
}
.about p:first-of-type {
  text-indent: 0;
}

.social-link {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;             
  justify-content: center;
}

.social-icon {
  width: 30px;             
  height: 30px;
  object-fit: contain;     
  vertical-align: middle;  
}

.social-link a {
  color: #777777;
  text-decoration: underline;
  text-underline-offset: 2px;
  font-size: 1.0rem;
}

.appstore-button {
  /*display: flex;*/
  text-align: center;
  /*border-top: 1px solid #204000;*/
  /*display: inline-block;
  width: 100%; */                
  max-width: 240px;          
}

.section-border {
  width: 100%;
  max-width:800px;
  border-top: 1px solid #204000;
  margin-top: 1rem;

}
.appstore-image {
  width: 40%;
  height: auto;      
  display: inline-block;
  justify-content: center;          
  /*display: block;*/             
  border-radius: 0rem;       
  box-shadow: 0 4px 12px rgba(0,0,0,0.15); 
}

.appstore-button:active .appstore-image {
  opacity: 0.85;                
}

    * {
      box-sizing: border-box;
      -webkit-font-smoothing: antialiased;
      text-rendering: optimizeLegibility;
      margin: 0;
      padding: 0;
    }

    body {
      background-color: #ffffff;         
      color: #204000;                    
      font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
      font-size: 16px;                  
      line-height: 1.5;
      display: flex;
      flex-direction: column;
      align-items: center;
      padding: 2rem 1rem 4rem;
    }

    
    .wrapper {
      width: 100%;
      max-width: 800px;                 
      display: flex;
      flex-direction: column;
      align-items: center;
      text-align: center;
    }

    
    .hero {
      margin-bottom: 0.0rem;
    }

    .brand {
      font-size: 1.25rem;
      font-weight: 600;
      letter-spacing: -0.03em;
    }

    .tagline {
      font-size: 1.0rem;
      font-weight: 400;
      color: #204000;
      margin-top: 0rem;
    }

    .subline {
      font-size: 0.9rem;
      color: #204000;
      margin-top: 0rem;
    }

    /* front end links section */
    .cta-block {
      width: 100%;
      display: flex;
      flex-direction: column;
      gap: 1rem;
      margin-bottom: 2.5rem;
    }

    .button-primary {
      display: block;
      width: 100%;
      text-align: center;
      text-decoration: none;

      background-color: #204000;       
      color: #ffffff;
      font-size: 1rem;
      font-weight: 600;
      padding: 1rem 1.25rem;
      border-radius: 0.75rem;            /* rounded corners */
      box-shadow: 0 4px 12px rgba(0,0,0,0.15);
    }

    .button-primary:active {
      transform: scale(0.98);
    }

 
    .button-disabled {
      width: 100%;
      text-align: center;

      background-color: #FFFFFF;
      color: #204000;
      font-size: 1rem;
      font-weight: 500;
      padding: 1rem 1.25rem;
      border-radius: 0.75rem;
      border: 2px dashed #204000;          
    }

   
    .docs-section {
      width: 100%;
      /*border-top: 1px solid #204000;*/
      padding-top: 0rem;
    }

    .docs-intro {
      font-size: 0.9rem;
      color: #204000;
      margin-bottom: 0rem;
    }

    .docs-links {
      display: flex;
      flex-wrap: wrap;
      justify-content: center;
      row-gap: 0.75rem;
      column-gap: 1rem;
      font-size: 1rem;
    }

    .docs-links a {
      color: #204000;
      text-decoration: underline;
      text-underline-offset: 2px;
    }

    .docs-links a:active {
      opacity: 0.6;
    }

    .indicia {
      font-size: 0.7rem;

    }

  
    .footer {
      margin-top: 2rem;
      font-size: 0.8rem;
      color: #204000;
      text-align: center;
    }

    .footer a {
      color: #204000;
      text-decoration: underline;
      text-underline-offset: 2px;
    }

    /* 7) t */
    @media (min-width: 600px) {
      body {
        padding-top: 1rem;
      }

      .brand {
        font-size: 1.5rem;
      }
/*
      .tagline {
        font-size: 1rem;
      }

      .subline {
        font-size: 1rem;
      }
*/
      .cta-block {
        flex-direction: row;        /* t */
        flex-wrap: wrap;
        justify-content: center;
      }

      .button-primary,
      .button-disabled {
        max-width: 240px;
      }
    }



@keyframes spin {
    to {
        transform: rotate(360deg);
    }
}