/*
 * Reset base browser styles to avoid interfering with other stuff.
 */
a,
abbr,
acronym,
address,
blockquote,
body,
caption,
code,
dd,
del,
dfn,
div,
dl,
dt,
em,
fieldset,
form,
h1,
h2,
h3,
h4,
h5,
h6,
html,
iframe,
img,
label,
legend,
li,
object,
ol,
p,
pre,
q,
span,
table,
tbody,
td,
tfoot,
th,
thead,
tr,
ul {
    border: 0;
    font-family: inherit;
    font-size: 100%;
    font-style: inherit;
    font-weight: inherit;
    vertical-align: baseline;
    margin: 0;
    padding: 0;
}

body {
    background-color: #fff;
    font-family: "Calibri", sans-serif;
}

#top-nav {
    background-color: #44709a;
    color: #fff;
    font-size: 1.2em;
    text-align: left;
    width: 100%;
}

#top-nav ul {
    margin: 0 auto;
    width: 800px;
}

#top-nav ul li {
    display: inline;
    line-height: 1.4em;
    list-style-type: none;
    text-align: center;
    vertical-align: middle;
}

#top-nav ul li a:link,
#top-nav ul li a:visited,
#top-nav ul li a:hover,
#top-nav ul li a:active {
    padding: 0 0.5em;
    text-decoration: none;
}

#top-nav ul li a:link,
#top-nav ul li a:visited {
    color: #fff;
}

#top-nav ul li a:active,
#top-nav ul li a:hover {
    background-color: #fff;
    color: #44709a;
}

#content {
    font-size: 1.2em;
    margin: 1em auto;
    min-width: 800px;
    max-width: 800px;
}

#content .left-thin {
    float: left;
    width: 320px;
}

#content .center {
    margin: 10px;
    width: 780px;
}

#content .right-thin {
    float: left;
    width: 245px;
}

#content .right-thin p {
    margin-top: 3em;
}

#content .right-thin img {
    margin-bottom: 1em;
    width: 240px;
}

#content .right-thick {
    float: right;
    margin-bottom: 3em;
    width: 450px;
}

#content .right-extra-thick {
    float: right;
    margin-bottom: 3em;
    width: 700px;
}

#content h1 {
    color: #44709a;
    font-size: 1.4em;
    font-weight: bold;
    margin: 1.5em 0;
}

#content .capabilities h1 {
    margin-top: 1em;
}

#content .patents h1 {
    margin-top: 1em;
}

#content p {
    margin: 1em 0;
}

#content .left-thin .sublink {
    display: inline-block;
}

#content a:link,
#content a:visited,
#content a:hover,
#content a:active {
    color: #44709a;
}

#content .left-thin .sublink a:link,
#content .left-thin .sublink a:visited,
#content .left-thin .sublink a:hover,
#content .left-thin .sublink a:active {
    font-style: italic;
}

#content .left-thin .sublink img {
    margin-top: 1em;
}

#content table th {
    font-weight: bold;
    text-align: left;
}

#content table th {
    border-bottom: 1px solid #ccc;
}

#content table th,
#content table td {
    padding: 0.5em 0.25em 0 0.25em;
}

#content form p {
    margin: 0;
    padding: 0;
}

#content form legend {
    background-color: #a1b8cd;
    display: block;
    font-weight: bold;
    margin-bottom: 0.25em;
    width: 100%;
    max-width: 600px;
}

#content form label {
    background-color: #a1b8cd;
    display: block;
    font-size: 0.8em;
    font-weight: bold;
    margin: 0 0 0.125em 0;
    padding: 0;
    width: 100%;
    max-width: 600px;
}

#content form input[type="email"],
#content form input[type="tel"],
#content form input[type="text"],
#content form textarea {
    background-color: #dae3ea;
    border: none;
    display: block;
    font-size: 1.1em;
    margin: 0 0 0.125em 0;
    padding: 0;
    width: 100%;
    max-width: 600px;
}

#content form input[type="submit"] {
    background-color: #a1b8cd;
    border: none;
    display: block;
    font-weight: bold;
    margin: 0 0 0.125em 0;
    text-align: center;
    width: 100%;
    max-width: 600px;
}

#footer {
    border-top: 2px solid #44709a;
    clear: both;
    color: #44709a;
    font-size: 0.9em;
    margin: 3em auto 1em auto;
    padding: 0.6em 0;
    width: 100%;
}

#footer-links {
    margin: 0 auto;
    max-width: 750px;
    min-width: 450px;
}

#footer #copyright {
    float: left;
    margin-left: 0.6em;
    width: 250px;
}

#footer #privacy-link {
    float: right;
    margin-right: 0.6em;
    text-align: right;
    width: 150px;
}

#footer #privacy-link a:link,
#footer #privacy-link a:visited,
#footer #privacy-link a:hover,
#footer #privacy-link a:active {
    color: #44709a;
    text-decoration: none;
}

h1.title{
    margin:0;
    font-family: "Calibri", sans-serif;
    font-weight:500;
    line-height:1.1;
    font-size:3rem;
    text-align:center;
    color:#44709A
}

h2.subtitle{
    margin-top:0;
    font-family: "Calibri", sans-serif;
    font-weight:300;
    font-size:1rem;
    line-height:1.0;
    text-align:center;
    text-decoration: none;
    color:#000000
}

.title-container {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px;
  max-width: 800px;
  margin: auto;
  flex-wrap: wrap; /* Enables wrapping for small screens */
}

.title-image {
  height: 100px;
  width: 100px;
  height: auto;
  flex-shrink: 0;
}

.title-text {
  flex: 1;
  min-width: 250px;
}

@media (min-width: 750px){
    h1.title{
        font-size:3rem
    }
    h2.subtitle{
        font-size:1rem
    }
}

@media (max-width: 580px){
  .title-container {
    flex-direction: column;
    text-align: center;
  }
}

@media (max-width: 770px){
  #content .center {
    width: 700px;
  }
}

@media (max-width: 720px){
  #content .center {
    width: 650px;
  }
}

@media (max-width: 670px){
  #content .center {
    width: 600px;
  }
}

@media (max-width: 620px){
  #content .center {
    width: 550px;
  }
}

@media (max-width: 570px){
  #content .center {
    width: 500px;
  }
}

@media (max-width: 520px){
  #content .center {
    width: 450px;
  }
}